Open Cosen95 opened 4 years ago
rules: [{ test: /\.(jpg|png|gif)$/, use: { loader: 'file-loader', options: { name: '[name]_[hash].[ext]', outputPath: 'images/', } } }]
rules: [{ test: /\.(jpg|png|gif)$/, use: { loader: 'url-loader', options: { name: '[name]_[hash].[ext]', outputPath: 'images/', limit: 204800 } } }]
module: { rules: [ { test: /\.css$/, use: [ 'style-loader', 'css-loader' ] } ] }
// 安装 yarn add sass-loader node-sass webpack --dev // loader执行顺序:从下至上,从右至左 // webpack.config.js module.exports = { ... module: { rules: [{ test: /\.scss$/, use: [{ loader: "style-loader" // 将 JS 字符串生成为 style 节点 }, { loader: "css-loader" // 将 CSS 转化成 CommonJS 模块 }, { loader: "sass-loader" // 将 Sass 编译成 CSS }] }] } };
// webpack.config.js { test: /\.scss$/, use: [ 'style-loader', 'css-loader', 'sass-loader', 'postcss-loader' ], }
//postcss.config.js module.exports = { plugins: [ require('autoprefixer')({ browsers: ['last 2 versions'] }), ], };
file-loader
url-loader
css-loader
style-loader
sass-loader
postcss-loader
//postcss.config.js module.exports = { plugins: [ require('autoprefixer')({ browsers: ['last 2 versions'] }), ], };