Awesome
<img src="https://github-sect.s3-ap-northeast-1.amazonaws.com/logo.svg" width="28" height="auto"> webpack-postcss
My Personal Boilerplate
- webpack 5
- Dynamic entry points: w/ @sect/webpack-sweet-entry
- PostCSS w/ postcss-preset-env
- SWC
- ESLint w/ Airbnb
- stylelint
- Prettier
- Secretlint
- husky / lint-staged
Branches
| Branch | Description |
|---|---|
| master | PostCSS that compliant tomorrow’s CSS syntax as much as possible w/ postcss-preset-env |
| module | ES Modules <script type="module"><br><ul><li>Support for Differential Serving of Modern and Legacy bundle.</li><li>In the next version this branch will be merged into the master branch.</li></ul> |
| sass | + SASS<br>- PostCSS |
| tailwindcss | + Tailwind CSS |
| typescript | + TypeScript<br>- JavaScript |
| react | ☝️ You can also use React partially<br>+ React |
| react-typescript | react + typescript |
| vuejs | ☝️ You can also use Vue.js partially<br>+ Vue.js |
| webpack-dev-server | + webpack-dev-server |
:beer: Setup
-
Setting for Support Browser (For Autoprefixer / SWC / postcss-preset-env)
Edit the following Line
package.json:memo: See Browserslist Doc
:hamburger: Commands
See package.json
| npm script | Description |
|---|---|
npm run dev | Watching for Dev |
npm run build | Building for Deploy |
:bookmark: NOTES
- Rename
.env.exampleto.envfor dotenv
:memo:$ mv .env.example .env.envfile is already set to "ignore" within the.giignorefile.
Troubleshooting
Remove Cache (SWC / ESLint / webpack)
$ rm -rf node_modules/.cache/swc-loader
$ rm -rf node_modules/.cache/eslint-loader
$ rm -rf node_modules/.cache/webpack
# Remove all
$ rm -rf node_modules/.cache