按照步骤来绝对可行
-
我是先在全局安装了webpack webpack-cli -g
npm install webpack webpack-cli -g -
然后又在项目中安装webpack webpack-cli
npm install webpack webpack-cli -D -
webpack4.x的打包已经不能用webpack 文件a 文件b的方式,而是直接运行webpack --mode development或者webpack --mode production,这样便会默认进行打包,
-
默认的打包 : 入口文件是’./src/index.js’,输出路径是’./dist/main.js’,其中src目录即index.js文件需要手动创建,而dist目录及main.js会自动生成。
-
我们可以自己设置入口文件,输出文件
-
在项目根目录下创建webpack.config.js
// 配置文件
const path = require('path')
module.exports = {
entry: path.join(__dirname, './src/main.js'), //入口文件
output: { //输出文件相关的配置
filename: 'bundle.js', //输出文件的名称
path: path.join(__dirname, 'dist')//指定打包好的文件,输出到哪个目录中去
},
mode: 'development'
}
6.找到项目根目录下的package.json文件
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack --mode development",
"build": "webpack --mode production"
}
7.最后直接执行npm run dev就可以了!