webpack基本属性配置

webpack 基本属性配置

欢迎访问我的博客,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
const path = require('path')
module.exports = {
entry: { // main是默认入口,也可以是多入口
main: './src/main.js'
},
// 出口
output: {
filename: './build.js', // 指定js路径
path: path.join(__dirname, '..', '', 'dist') // 最好是绝对路径
// 代表上一级的dist
},
module: {
// 一样的功能rules: webpack2.xx新加的
loaders: [ // require('./a.css||./a.js')
{
test: /\.css$/,
loader: 'style-loader!css=loader',
//多个loader用!分割
//顺序是反过来的 2!1 多个loader
},
{
test: /\.(jpg|svg)$/,
loaderL 'url-loader?limit=4096&name=[name].[ext]',
// limit=4096&name=[name].[ext]' 多个参数之间用&符号分割
//[name].[ext]内置提供的
options: {
limit: 4096,
name: '[name].[ext]'
}
}
]
},
plugins: [
// 插件的执行顺序是依次执行的,和loader是反过来的
new htmlWebpackPlugin({
template: './src/index.html',
})
// 将src下的template属性描述的文件根据当前配置的output.path,将文件移动到该目录。
// 在插件的执行过程中,它本身可以去拿当前所设置的webpack选项,便于对webpack选项的复用,
]
}

本文标题:webpack基本属性配置

文章作者:王工头

发布时间:2018年12月29日 - 12:57:41

最后更新:2019年01月25日 - 12:32:54

原始链接:https://qqqww.com/webpack基本属性配置/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。

-------------本文结束感谢大佬们的阅读-------------