最初后为了学习Github Actions, 后来想了下加一下内容打通前端工程化整个流程
主要功能点如下
- 使用
webpack
构建,区分开环境和生产环境,打包纯原生项目,不是用框架或脚手架是为了再熟悉一下webpack配置 - 支持
ts
采用babel
编译ts
, 缺点是类型检查使用新得命令npx tsc --noEmit --watch
- 支持
babel
根据browserslist
打补丁, 默认支持的是android 7
和ios 12
, 你可以调整browserslist
写一下es6句法或API试试看 - 支持
sass
(今天发现dart-sass
变更为sass
,相对于node-sass
,它不受node
版本影响) - 支持
postcss
,只用了postcss-preset-env
一个插件,它也会根据browserslist
给样式打补丁的 - 代码规范采用的是
eslint
+prettier
+editorconfig
,建议安装VSCode
的对应的插件并配置VSCode
保存自动格式 - 单元测试采用
jest
- 通过
lint-staged
工具配置了pre-commit
检查,提交代码前会格式化代码然后执行单元测试,只有执行通过才能commit
- 配置
push
到main
分支才触发workflow
,连接服务器、拉代码、打包、部署。