首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何运行ng lint并在预提交时检测错误?

如何运行ng lint并在预提交时检测错误?
EN

Stack Overflow用户
提问于 2021-04-20 17:50:29
回答 1查看 1.8K关注 0票数 5

我的预提交脚本有一个问题。我正在尝试运行我的angular项目预提交文件的"ng lint“;当检测到lint错误时,我在日志中看到错误,但预提交过程成功通过。我需要在预提交文件中执行ng-lint,因为我将运行其他验证...当ng lint没有成功通过时,我如何获得消息?

我的脚本:

代码语言:javascript
复制
#!/bin/bash

### other scripts to validate custom commits

-----------



### Run ng lint

echo "pre-commit hook --> linting" ng lint

ng lint

echo -e "ng lint pass sucessfully \n\n"

日志

代码语言:javascript
复制
pre-commit hook --> linting
Linting "front-firefly-backoffice"...
/home/apanez/Escritorio/htdocs/eci/front-firefly/src/app/stock/limit-sale/components/limit-sale-detail/limit-sale-detail.component.ts:30:14
ERROR: 30:14  component-class-suffix  The name of the class LimitSaleDetailComp should end with the suffix Component (https://angular.io/styleguide#style-02-03)

Lint errors found in the listed files.

ng lint pass sucessfully
EN

回答 1

Stack Overflow用户

发布于 2021-04-20 20:09:12

修复提交时的lint问题

您可以在提交时自动修复所有的lint问题。

以下是步骤:

使用eslint (将YOUR_PROJECT_NAME替换为您的angular项目的名称)

代码语言:javascript
复制
ng add @angular-eslint/schematics
ng g @angular-eslint/schematics:convert-tslint-to-eslint YOUR_PROJECT_NAME

安装eslint规则插件,以便您可以设置JSON规则:

代码语言:javascript
复制
npm install --save-dev eslint-plugin-json

更新.eslintrc.json以使用插件:

代码语言:javascript
复制
{
  "extends": ["plugin:json/recommended"],
   ...
}

安装更漂亮的、赫斯基的和lint-staged的

代码语言:javascript
复制
npm install --save-dev prettier husky lint-staged

全局安装赫斯基:

代码语言:javascript
复制
npm install husky -g

安装git挂钩(这将创建.husky文件夹):

代码语言:javascript
复制
husky install  

设置lint-通过将以下内容添加到package.config进行分段

代码语言:javascript
复制
  "devDependencies: {
     ...
  },
  "lint-staged": {
    "*.{js,json,css,scss,md,ts,html}": [
      "prettier --write",
      "eslint --fix"
    ]
  }

可选:到目前为止,尝试使用lint-staged测试您的配置

代码语言:javascript
复制
npx lint-staged

添加pre-commit git挂钩:

代码语言:javascript
复制
husky add .husky/pre-commit "npx lint-staged"

修改package.json,添加一个安装后步骤来安装赫斯基:

代码语言:javascript
复制
"scripts": {
  "postinstall": "husky install && husky add .husky/pre-commit \"npx lint-staged\"",
   ...
},

测试您的设置

修改一些.ts、json或.html文件

代码语言:javascript
复制
git add *
git commit -m "updated"

您应该会看到:

代码语言:javascript
复制
[STARTED] Preparing...
[SUCCESS] Preparing...
[STARTED] Running tasks...
[STARTED] Running tasks for *.{js,json,css,scss,md,ts,html}
[STARTED] prettier --write
[SUCCESS] prettier --write
[STARTED] eslint --fix
[SUCCESS] eslint --fix
[SUCCESS] Running tasks for *.{js,json,css,scss,md,ts,html}
[SUCCESS] Running tasks...
[STARTED] Applying modifications...
[SUCCESS] Applying modifications...
[STARTED] Cleaning up...
[SUCCESS] Cleaning up...
[master 20fdf85] updated
票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/67176520

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档