前提:知道webpack4的基礎(chǔ)配置以及如何使用配置文件進(jìn)行打包
第一講 Webpack 4 學(xué)習(xí)01(基礎(chǔ)配置)
一、單出口形式
webpack.config.js
const path = require('path');
module.exports = {
//單出口形式
entry:['./public/index.js','./public/index2.js'],//有多個(gè)文件
output:{
path:path.resolve(__dirname,'build'),
filename:'bundle.js'
}
}
image
-
運(yùn)行
npm run dev
生成唯一的打包文件
bundle.js
image
二、多出口形式
? webpack.config.js
const path = require('path');
module.exports = {
//多出口形式
entry:{
entryOne:'./public/entryOne/index.js',
entryTwo:'./public/entryTwo/index.js',
},
output:{
path:path.resolve(__dirname,'build'),
filename:'[name].js'
}
}
?
-
文件結(jié)構(gòu)
image -
運(yùn)行
npm run dev
-
生成兩個(gè)打包文件
image
-