歡迎訪問我的博客https://qqqww.com/埃儿,祝碼農(nóng)同胞們?cè)缛兆呱先松鷰p峰招盲,迎娶白富美~~~
const path = require('path')
module.exports = {
entry: { // main是默認(rèn)入口,也可以是多入口
main: './src/main.js'
},
// 出口
output: {
filename: './build.js', // 指定js路徑
path: path.join(__dirname, '..', '', 'dist') // 最好是絕對(duì)路徑
// 代表上一級(jí)的dist
},
module: {
// 一樣的功能rules: webpack2.xx新加的
loaders: [ // require('./a.css||./a.js')
{
test: /\.css$/,
loader: 'style-loader!css=loader',
//多個(gè)loader用!分割
//順序是反過來的 2!1 多個(gè)loader
},
{
test: /\.(jpg|svg)$/,
loaderL 'url-loader?limit=4096&name=[name].[ext]',
// limit=4096&name=[name].[ext]' 多個(gè)參數(shù)之間用&符號(hào)分割
//[name].[ext]內(nèi)置提供的
options: {
limit: 4096,
name: '[name].[ext]'
}
}
]
},
plugins: [
// 插件的執(zhí)行順序是依次執(zhí)行的萍聊,和loader是反過來的
new htmlWebpackPlugin({
template: './src/index.html',
})
// 將src下的template屬性描述的文件根據(jù)當(dāng)前配置的output.path渗磅,將文件移動(dòng)到該目錄。
// 在插件的執(zhí)行過程中簿晓,它本身可以去拿當(dāng)前所設(shè)置的webpack選項(xiàng),便于對(duì)webpack選項(xiàng)的復(fù)用千埃,
]
}