1、命令行直接打包,不使用配置文件 webpack-cli --entry ./app.js --output bundle.js 项目下生个bundle.js文件(依赖等都被打包进来)
2、利用配置文件打包,命令行 -- webpack webpack.config.js(默认配置文件名,如果为告诉webpack配置文件名,webpack会自动查找改文件名 )
1)直接以当前目录下webpack.config.js的文件作为配置文件进行打包
2)指定了一个文件作为配置文件打包,则 webpack --config configfile
3、局部webpack与全局webpack
1)全局webpack 通过npm install webpack -g安装, -g指令就是在npm全局目录下安装包
作用:
全局webpack是必须要安装的,我们在命令行直接执行webbpack指令时,使用的就是全局的webpack去完成的
安装:
通过npm install webpack -g安装, -g指令就是在npm全局目录下安装包
2)局部webpack 在当前项目文件夹下安装的webpack,即安装在项目文件夹里的node_modules里
作用: 全局的webpack有且只有一个,但是实际中,不同项目的webpack版本可能完全不同,当我们项目需求的webpack版本呢和我们全局的webpack不一致时,就需要安装局部的 安装: 进入到项目的文件夹下 npm install webpack@3.10.0 --sava
4、利用局部的webpack打包
局部安装 --> 配置package.json文件 --> 命令行运维package.json定义的命令
配置package.json文件 ,在scripts属性值设置,默认先使用项目中配置的webpack版本,没有配置会去全局找
//打包命令 npm run build { "name": "vue-element-admin", "version": "4.2.1", "description": "设置打包命令为 npm run build", "author": "Pan <panfree23@gmail.com>", "license": "MIT", "scripts": { "build": "webpack", //名字可以随意起 ,属性值为webpack } }