emily-webpack

1.0.2 • Public • Published


开发模式
npx webpack serve --config ./config/webpack.dev.js

生产模式
npx webpack --config ./config/webpack.prod.js

配置完 package.json
运行开发模式:npm start

运行生产模式:npm run build

ps: npm publish 修改了文件名, 从 webpack 到 emily-webpack.

1. style-loader 会生成单独的 style 标签插入到 html 里
2. MiniCssExtractPlugin.loader, //提取 css 成单独的文件 https://webpack.docschina.org/plugins/mini-css-extract-plugin 可以解决闪屏问题

css 兼容性处理
url: https://webpack.docschina.org/loaders/postcss-loader#root
安装:npm install --save-dev postcss-loader postcss postcss-preset-env
postcss-loader 能解决大多数样式兼容问题,需要在 css-loader 下面,同时需要在 less-loader 前面。
在 paackage.json 里添加 browserslist 来做兼容性
"browserslist":[
"> 1%",
"last 2 versions",
"not dead"
]

css 压缩 https://webpack.docschina.org/plugins/css-minimizer-webpack-plugin/#root
step1 npm install css-minimizer-webpack-plugin --save-dev
step2 在 webpack.config.js 引入 const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
step3 new MiniCssExtractPlugin()
step4 执行 npm run build

默认生产模式已经开启了 html 和 js 的压缩

Readme

Keywords

none

Package Sidebar

Install

npm i emily-webpack

Weekly Downloads

0

Version

1.0.2

License

ISC

Unpacked Size

141 kB

Total Files

28

Last publish

Collaborators

  • emily.jiao