Javascript 项目常用的一些配置文件

zxhaaa 发布于2019-08-21 18:40 / 3242人阅读

摘要：引子基本上上优秀的项目上面有很多零零碎碎的文件。其他平台除了，市面上还有其他很多平台，如项目中使用的和等等。利用提供的若干规则，造出一份适合于自己或团队的代码规范配置，同时用规则去忽略文件只是用来纯粹美化代码。

引子

基本上 GitHub 上优秀的javascript项目上面有很多零零碎碎的文件。如图，以koa为例

下文将一一说明这些个“奇怪”的文件是干什么的...

持续集成篇

持续集成（CI, Continuous integration），是将我们的代码规范化流程化。
相比于系统集成，CI希望每一次微小的代码修改，都会进行一次集成（可能包括构建，测试，发布等阶段），这样极大地加强了项目工程的可控性。

从 GitLab 8.0 开始，GitLab CI 就已经集成在 GitLab 中^[1]。那么 GitHub 中对于CI的支持如何呢？GitHub 可以采用任意第三方的 CI 服务，下面主要介绍其中的一种：travis-ci

travis-ci (.travis.yml)

官网：https://travis-ci.org/
该平台也是本人经常使用的 CI 平台，需要在项目跟目录下添加文件 .travis.yml，如：

language: node_js
node_js: stable

install:
  - npm install
script:
  - npm test

便是一个简单的配置文件参考，travis-ci 有下面几个生命周期，顺序如下：^[2]

before_install

install

before_script

script

after_success 或者 after_failure

before_deploy

deploy

after_deploy

after_script

同时 travis-ci 还提供了一大批的 Provider，以方便我们来书写一些常用的部署动作^[3]

配置好了之后，同时在travis-ci认证提供之后，并且给对应的repo赋予权限，那么我们的每次commit都会触发按照上面的执行过程，在travis-ci提供的集群上执行。

其他 CI 平台

除了 travis-ci，市面上还有其他很多 CI 平台，如：react 项目中使用的 appveyor 和 CircleCi 等等。至于这些平台的对比则不是该文章的讨论范畴了。

代码规范篇

代码规范又是另一个话题了，但是目的都是为了提高代码的可控性，减少 bug 率。

ESLint (.eslintrc.*, .eslintignore)

利用 ESLint 提供的若干规则，造出一份适合于自己或团队的代码规范配置，同时 .eslintignore 用 glob file 规则去忽略文件

Prettier (.prettierrc, .prettierignore)

Prettier 只是用来纯粹美化代码。

工具篇 CodeCov (.codecov.yml)

一个好的工程，离不开一系列的测试，CodeCov 则是用来报告测试中代码覆盖率的工具

Babel (.babelrc, .babelignore) NPM (.npmrc)

这俩兄弟不多做解释了，前端都知道~

其他 .editorconfig

http://editorconfig.org/
我们在不同编辑器，不同系统平台编写同一项目代码时，常常会遇到代码格式不统一的问题，该文件则是用来抹去这种差异！

结

以上便是比较常用的一些javascript项目的配置文件说明，后续还会不断添加，欢迎大家伙指正添加。

参考

[1] 用 GitLab CI 进行持续集成

[2] travis-ci: Customizing the Build

[3] travis-ci: Deployment

超融合服务器专线服务 linux的一些常用命令配置阿里云window服务器的一些坑云服务器可以清除哪一些文件文件服务器的项目

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/90703.html

TCM的webpack配置与常用插件

摘要：中的配置热加载插件安装中的配置优化插件为组件分配，通过这个插件可以分析和优先考虑使用最多的模块，并为它们分配最小的压缩代码分离和文件 0 前言本文是针对TCM项目所做的WebPack配置文件总结，主要概述了一些常用配置选项和插件使用，对以后的项目有指导意义。TCM的webpack配置文件包括webapck.config.base.js、webapck.config.dev.js、we...

罗志环 2019-08-20 14:36 评论0 收藏0
TCM的webpack配置与常用插件

摘要：中的配置热加载插件安装中的配置优化插件为组件分配，通过这个插件可以分析和优先考虑使用最多的模块，并为它们分配最小的压缩代码分离和文件 0 前言本文是针对TCM项目所做的WebPack配置文件总结，主要概述了一些常用配置选项和插件使用，对以后的项目有指导意义。TCM的webpack配置文件包括webapck.config.base.js、webapck.config.dev.js、we...

时飞 2019-08-05 10:51 评论0 收藏0
TCM的webpack配置与常用插件

摘要：中的配置热加载插件安装中的配置优化插件为组件分配，通过这个插件可以分析和优先考虑使用最多的模块，并为它们分配最小的压缩代码分离和文件 0 前言本文是针对TCM项目所做的WebPack配置文件总结，主要概述了一些常用配置选项和插件使用，对以后的项目有指导意义。TCM的webpack配置文件包括webapck.config.base.js、webapck.config.dev.js、we...

张宪坤 2019-08-01 16:23 评论0 收藏0
NPM — JavaScript 的包管理器

摘要：是的默认模块管理器，一个命令行下的软件，用来安装和管理模块，同时也可以管理其他开放式的模块代码。的包管理器可以查看所有可使用的命令。发布记得在推之前先登录要不然会报错。最后需要把文件里面的删除掉要不然上传时会忽略掉打包的文件。本文主要介绍npm的常用命令，以及如何发布一些常用的js模块化代码到npm上面方便日后的使用，和举例如何把一个vue组件打包发布到npm到最后下载到本地使用的过...

ZweiZhao 2019-08-21 17:49 评论0 收藏0
前端常用技术概述--Less、typescript与webpack

摘要：前言讲起前端，我们就不能不讲与，在这两种技术广泛应用的今天，他们的扩展也是层出不穷，的扩展有等，的超集有等。如下注意你的样式文件一定要在引入前先引入。截止目前，已经发布了最新的版本。前言：讲起前端，我们就不能不讲CSS与Javascript，在这两种技术广泛应用的今天，他们的扩展也是层出不穷，css的扩展有Less、Sass、Stylus等，js的超集有Typescript等。今天我们就简...

番茄西红柿 2019-04-23 11:55 评论0 收藏0