ice/umi 下的工程文件详解

619 阅读3分钟

以下所述工程文件均存在于以 iceumi 搭建的项目中。

.editorconfig


《编辑器配置》

定义此项目中一致的编码风格,例如相同的缩进格式。

.eslintignore


告诉eslint忽略此文件中注明的文件或目录。即 git 提交时 eslint 不会检查该文件中表明的文件是否有 lint 报错。

.eslintrc.js 🌟


规则条目配置 image.png

  • plugins:依赖的插件
  • import-order:指文件内导入文件的顺序
    • builtin-内置(一些内置组件:如 node 原生的东西,path等)
    • external-外部(如从node_modules里引入的东西)
    • internal-内部(内部组件,如components 下声明的东西,自己写的一些组件)
    • parent-父级(../)
    • sibling-兄弟级(./)
    • index-自己
  • @typescript-eslint 整体是一个插件包,/ 后面是其包含的一种规则,off 表示该规则关闭。

  .gitignore


告诉 Git 在您提交时忽略哪些文件和目录。即git push的时候,git 不会检测这些文件的变化和改动,比如node_modules肯定不能提交,会写在此目录里。

  •   #production:npm run build的时候会生成产物,上产环境的产物,也是不需要提交的。提交的是源码,不是编译后的产物。
  •   #misc:操作系统和ide的一些东西
  •   .idea/:ide 如 vs storm的一些配置
  •   _DS_Store:mac系统一些文件存储的东西,就是文件的配置信息,比如这个文件的图标信息,所有者等。

  .npmrc    


为了换源。正常情况下拉的源是npm.org,需要换到阿里淘宝....npm install -d --registry 地址。配置后,npm install会自动走此处的写的源。

为什么要换源?

npm的源registry在国外,下载包时,是从国外的 NPM 服务器上下载,所以在国内使用下载安装的时候会非常慢,有时候还会经常中断。

网上有很多解决办法:

  • 可以使用淘宝提供的源 npm install cnpm -g --registry=``https://registry.npm.taobao.org

  • 推荐使用yarn。

  • 不推荐使用cnpm,会出现问题。比如: 很多前端工程项目都存在一个 package-lock.json 的文件。

  • cnpm i不受 package-lock.json 影响,只会根据 package.json 进行下载安装。

  • cnpm i xxx@xxx不会更新到 package-lock.json 中去。

  • npm i xxx@xxx 会更新到 package-lock.json 中去。

    在多人共同协作维护的项目中,package-lock.json 是必不可少的,是为了确保不同开发者安装的包及其依赖保持一致,同时也是降低不同版本 npm 包给项目稳定性带来的影响。

  .nvmrc


nvm多版本的node工具,用来定义版本。自动切换到这个版本,node 版本。

build.json


不同框架下的不同工程配置

  typing.d.ts


一定要引入到tsconfig.json。src/ 路径下所有的文件,mock/ 下所有的文件都遵循ts规则。

之所以后缀是.d.ts是因为它不会生成编译产物,它只是用来声明文件,所以只能用来写 interface / type,即一定是变量不能是函数,写函数的话编译出来会丢失。

  scm_build.sh


上线打包发布,git上都是源码,部署的时候部署的是编译产物。编译过程都是在线上进行的,用的工具就是SCM 代码发布管理工具(底层封装是jenkins)。