loader是模块和资源转换器

loader的安装是用来读取css文件的css-loader,再用style-loader把它插入到页面的

安装命令如下:


npm install css-loader style-loader --save-dev
package.json中,主要是devDependencies这个字段有改变

"devDependencies": {
    "css-loader": "^0.23.1",
    "style-loader": "^0.13.0",
    "webpack": "^1.12.2"
}

还是上一篇文章中的文件,添加一个css文件,style.css,内容如下:

body{
    font-size:20px;
    color: yellow;
}

修改file.js文件,原文内容不变,添加require("!style-loader!css-loader!./style.css");,用来引入css文件。
继续编译:

webpack file.js f1.js

扩展名字段绑定loader


file.js文件中的require("!style-loader!css-loader!./style.css");,修改为require("./style.css"),执行命令如下:

webpack file.js f1.js --module-bind "css=style-loader!css-loader"

你可能感兴趣的:(loader是模块和资源转换器)