/react-ts-qs

react-ts-quick-starter

Primary LanguageJavaScriptOtherNOASSERTION

react-ts-qs

按照 https://juejin.im/post/6860129883398668296 这篇文章配置的，准备弄一下以后使用

步骤

项目初始化及配置

  1. package.json √
  2. LICENSE √
  3. .gitignore √
  4. .npmrc √
  5. README.md √

规范代码与提交

  1. EditorConfig √
  2. Prettier √
  3. ESlint √
  4. StyleLint √
  5. lint 命令 √
  6. ESLint、StyleLint 和 Prettier 的冲突 √
  7. lint-staged √
  8. commitlint + changelog √

webpack 基本配置

  1. 开始 √

  2. input、output √

  3. 公共变量文件 √

  4. 区分开发、生产环境 √

  5. mode √

  6. 本地服务实时查看页面 √

  7. devtool √

  8. 打包编译前清理 dist 目录 √

  9. 样式处理文件 √

    • CSS
    • LESS
    • SASS
    • PostCss

  10. 图片和字体文件处理 √

支持 React √

支持 TypeScript

  1. 安装对应 babel 插件 √
  2. tsx 语法测试 √
  3. tsconfig.json √

更多 babel 配置 √

公共（common）环境优化

  1. 拷贝公共静态资源 √
  2. 显示编译进度 √
  3. 编译时的 typescript 类型检查 √
  4. 加快二次编译速度 √
  5. external 减少打包体积 √
  6. 抽离公共代码 √

开发（dev）环境优化

  1. 热更新 √
  2. 跨域请求 √

生产（prod）环境优化

  1. 抽离出 css 样式 √
  2. 去除无用样式 √
  3. 压缩 js 和 css 代码 √
  4. 添加包注释 √
  5. tree-shaking √
  6. 打包分析 √

个人扩展

  1. 增加 thread-loader
  2. dev 环境默认端口号是 本机网络 ip
  3. 配置 react-router