- 安装pnpm
- tsc, ts-loader, @babel/preset-typescript 有什么区别?
# 安装webpack
pnpm add webpack webpack-cli webpack-merge webpack-dev-server @babel/core @babel/preset-react @babel/preset-typescript babel-loader css-loader less style-loader less-loader postcss postcss-loader tailwindcss autoprefixer html-webpack-plugin cross-env -D --filter @proj/react-x
pnpm add mini-css-extract-plugin -D --filter @proj/react-x
# 压缩,分治
pnpm i css-minimizer-webpack-plugin terser-webpack-plugin -D --filter @proj/react-x
pnpm i core-js -D --filter @proj/react-x
- FMP
- 根据需求
- I/O角度: 让你的bundlesize最小
- minimize, terser, gzip
- gzip: compression-webpack-plugin
- CDN
- DNS
- webp
- minimize, terser, gzip
- I/O角度: 让你的bundlesize最小
- 根据需求
- @headlessui/react组件库
gulp 好选择 rollup 分文件夹,一起构建
# 全局安装
pnpm i @headlessui/react -S -w
- react-app-rewire-inline-source-plugin