本章讲述使用gulp+eslint实现微信小程序项目，代码规范保存自动格式化。

1、修改项目package.json内的devDependencies（插件依赖），添加如下插件：

"gulp": "^4.0.2",
"gulp-cli": "^2.3.0",
"eslint": "^6.8.0",
"babel-eslint": "^10.1.0"

2、修改项目package.json内的scripts字段值，添加如下脚本：

"gulp": "cd node_modules/gulp && gulp",
"lint": "eslint --ext .js ./ --fix"

3、项目根目录添加.eslintrc.js文件，内容如下：

// 具体可参考eslint官网，进行配置，如下仅供参考

module.exports = {
  env: {
    node: true,
    commonjs: true,
    es6: true,
    amd: true
  },
  parser: "babel-eslint",
  parserOptions: {
    "ecmaVersion": 6,
    "sourceType": "module"
  },
  extends: [
    "eslint:recommended"
  ],
  globals: {
    "App": true,
    "Page": true,
    "Component": true,
    "Behavior": true,
    "wx": true,
    "getApp": true,
    "getCurrentPages": true
  },
  rules: {
    "semi": [1, "always"], // 语句结束强制分号
    "no-global-assign": "error", //禁止修改全局变量
    "no-trailing-spaces": "error", //不允许在行尾使用尾随空格
    "no-multiple-empty-lines": "error", //不允许多个空行
    "no-else-return": "warn",//如果if语句里面有return,后面不能跟else语句
    "no-empty": "error", //块语句中的内容不能为空
    "no-inline-comments": "error",//禁止行内备注
    "no-var": "error",//禁用var，用let和const代替
    "camelcase": "error",//强制驼峰法命名
    "init-declarations": "error",//声明时必须赋初值
    "space-before-function-paren": "off",//函数定义时括号前面要不要有空格
    "use-isnan": "error", //要判断一个变量是否是 NaN 的时候，一定要用 isNaN 方法
    "comma-dangle": "warn", //行末逗号
    "no-useless-escape": "off", //不允许不必要的转义字符
    "prefer-promise-reject-errors": "off" //要求使用错误对象作为拒绝承诺的原因
  }
}

4、项目根目录添加gulpfile.js文件，内容如下：

// 具体可参考gulp官网，进行配置，如下仅供参考

const gulp = require('gulp');
const process = require('child_process');

const lintCode = function(callback) {
  // 终端运行一个 "npm run lint" 的子进程
  process.exec('npm run lint', function(error, stdout) {
    console.log(stdout);
  });
  callback();
};

gulp.watch('pages/login/index.js', lintCode);

exports.default = function (callback) {
  callback();
};

5、至此项目配置已结束，可在终端执行以下操作来启动代码自动格式化功能：

先运行 npm i 来安装所有添加的依赖插件，然后运行 npm run gulp（运行后该窗口不要关掉） 后即可开始编写项目代码，编写期间每保存一次代码，便会自动根据eslint配置格式化代码一次。

（如电脑配置较低情况下，不想自动格式化代码，不运行npm run gulp，直接编写代码即可，待最后commit代码时，先运行npm run lint格式化代码一次即可）

 

附加：如需强制代码commit时必须符合eslint规范，可参考如下进行配置：

1、修改项目package.json内的devDependencies（插件依赖），添加如下插件：

"husky": "^4.2.3"

2、项目package.json内的根对象最后添加如下代码：

"husky": {
        "hooks": {
            "pre-commit": "eslint --ext .js ./ --fix"
        }
    }