首先通过npm init -y 默认生成一个package.json的文件
然后去全局下载依赖
sudo npm install webpack webpack-cli -g ( Mac下载方式 )
接着下开发环境安装webpack 与 webpack-cli
npm install webpack webpack-cli -D
我们可以先定义一个build文件夹和src文件夹并且在src文件夹中编写一段JS脚本
src下JS脚本实例:
function add(x,y){
return x+y;
}
console.log(add(2,3))
然后通过 webpack ./src/index.js -o ./build/build.js --mode=development 指令对src下的index.js文件进行打包,如果build中没有定义build文件那么会自动生成一个build文件
接下来我们就可以使用打包好的文件了,在build中定义一个html文件,然后引入build.js文件就可以看到在浏览器控制台打印出了对应的信息.
webpack打包其他资源
打包样式资源：webpack打包其他的资源需要插件的辅助,它只能默认打包js资源,比如我们想要打包一个css资源,就需要在webpack.config.js中进行配置
webpack.config.js配置
在进行配置完毕之后,就可以在index.js（在src中我们设置的入口文件）引入css文件，接着我们需要再次使用命令行打包一次
webpack ./src/index.js -o ./build/build.js --mode=development
接下来打开build文件中的html文件就可以看到我们已经成功的引入css样式了。
webpack打包sass / scss / less 文件
同理我们有的时候可能会用到sass,scss,less文件,那么我们也需要下载对应的插件,在webpack.config.js中进行我们的一个配置。
webpack打包less文件
