西门子线头
西门子Lint可以帮助您改进并保持项目的代码质量 高水平。它提供了预置和插件的各种使用 西门子。
我们欢迎更多的检测规则和配置的加入 此仓库适用于各种其他编程语言和框架。
预置可用于以下语言:
插件:
- eslint-plugin-defaultvalue
用于 typescript-eslint 自动
注释
@defaultValueTSDoc标签
安装
安装 @siemens/*-config* 以及它们在你的项目中的对等依赖关系(你需要哪个):
npm install @siemens/stylelint-config-scss --save-dev --save-exact
npm install @siemens/commitlint-config --save-dev --save-exact
npm install @siemens/prettier-config --save-dev --save-exact
npm install @siemens/eslint-config-typescript --save-dev --save-exact
npm install @siemens/eslint-config-angular --save-dev --save-exact
注意 您应该指定上述和的软件包的确切版本
他们的同伴依赖关系 eslint 它的插件, stylelint,
stylelint-config-sass-guidelines 和 @commitlint/config-conventional. 规则
将在补丁版本中更改。
ESLint
我们的ESLint配置不包含任何格式化规则。 请使用格式化程序 更漂亮 或者为ESLint添加一个格式化规则集,比如 ESLint风格.
打印稿
在根目录中包含ESLint预设 eslint.config.mjs:
import path from 'path';
import { fileURLToPath } from 'url';
import { defineConfig } from 'eslint/config';
import typescriptConfig from '@siemens/eslint-config-typescript';
// mimic CommonJS variables
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
export default defineConfig({
extends: [...typescriptConfig],
files: ['**/*.ts'],
languageOptions: {
parserOptions: {
project: ['tsconfig.json', 'tsconfig.app.json', 'tsconfig.spec.json', 'e2e/tsconfig.json'],
tsconfigRootDir: __dirname
}
}
});
注意: 要使用不那么严格的规则,请使用
base规则,通过导入{ configBase }代替。
角
在根目录中包含ESLint预设 eslint.config.mjs:
import path from 'path';
import { fileURLToPath } from 'url';
import { defineConfig } from 'eslint/config';
import angularTypescriptConfig from '@siemens/eslint-config-angular';
import angularTemplateConfig from '@siemens/eslint-config-angular/template';
// mimic CommonJS variables
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const tsConfig = defineConfig({
extends: [...angularTypescriptConfig],
files: ['**/*.ts'],
languageOptions: {
parserOptions: {
project: ['tsconfig.json', 'tsconfig.app.json', 'tsconfig.spec.json', 'e2e/tsconfig.json'],
tsconfigRootDir: __dirname
}
},
rules: {
'@angular-eslint/directive-selector': [
'error',
{
type: 'attribute',
prefix: 'app',
style: 'camelCase'
}
],
'@angular-eslint/component-selector': [
'error',
{
type: 'element',
prefix: 'app',
style: 'kebab-case'
}
]
}
});
const templateConfig = defineConfig({
extends: [...angularTemplateConfig],
files: ['**/*.html']
});
export default defineConfig(...tsConfig, ...templateConfig);
图书馆和其他的东西 projects 目录,
创建一个额外的 eslint.config.mjs 对于每个看起来像这样的项目:
import { defineConfig } from 'eslint/config';
import { tsConfig, templateConfig } from '../../eslint.config.mjs';
export default defineConfig(
{
extends: [...tsConfig],
files: ['**/*.ts'],
languageOptions: {
parserOptions: {
project: ['projects/element-ng/tsconfig.lib.json', 'projects/element-ng/tsconfig.spec.json']
}
},
rules: {
'@angular-eslint/component-selector': [
'error',
{
type: 'element',
prefix: 'si',
style: 'kebab-case'
}
],
'@angular-eslint/directive-selector': [
'error',
{
type: 'attribute',
prefix: 'si',
style: 'camelCase'
}
]
}
},
...templateConfig
);
这个 @angular-eslint/builder 会不会自动接库
配置位置,手动提供 angular.json:
@@ -122,15 +125,11 @@
}
},
"lint": {
"builder": "@angular-eslint/builder:lint",
"options": {
"lintFilePatterns": [
"src/**/*.ts",
"src/**/*.html"
],
+ "eslintConfig": "path/to/project/eslint.config.mjs"
}
},
从TSLint迁移
也在 angular.json,确保替换TSLint相关的条目,如
这样的:
@@ -122,15 +125,11 @@
}
},
"lint": {
- "builder": "@angular-devkit/build-angular:tslint",
+ "builder": "@angular-eslint/builder:lint",
"options": {
- "tsConfig": [
- "tsconfig.app.json",
- "tsconfig.spec.json",
- "e2e/tsconfig.json"
- ],
- "exclude": [
- "**/node_modules/**"
+ "lintFilePatterns": [
+ "src/**/*.ts",
+ "src/**/*.html"
]
}
},
注意: 使用较不严格的规则,这些规则来源于上游 Angular推荐和更多面向应用的推荐,请使用
base规则,通过导入{ configBase }代替。
Stylelint
控件中包含样式预设 .stylelintrc.yml:
extends:
- '@siemens/stylelint-config-scss/stylelintrc.yml'
Commitlint
包含提交预设 package.json:
"commitlint": {
"extends": [
"@siemens/commitlint-config/.commitlintrc.js"
]
},
// Optional: Pre-commit hook using husky: https://github.com/typicode/husky
"husky": {
"hooks": {
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
更漂亮
包含共享的Prettier配置 package.json:
"prettier": "@siemens/prettier-config",
ESLint插件
ESLint插件的用法有文档说明 在这里.
使用
预设现在将被自动使用 eslint 和 ng lint. 请
参考 角ESLint 和
ng线头 有关更多详细信息的文档。
将commitlint、ESlint和stylesint脚本添加到你的 package.json:
"scripts": {
"lint": "ng lint",
"lint:sass": "stylelint **.scss",
"lint:commit": "commitlint --from=origin/main",
"lint:all": "npm run lint:commit && npm run lint && npm run lint:sass"
}
要自动修复ESLint问题,使用:
"scripts": {
"lint:fix": "ng lint --fix"
}
要自动修复字体问题,请使用:
"scripts": {
"lint:sass:fix": "stylelint --fix **.scss"
}
确保调用CI构建链中的linter .gitlab-ci.yml:
lint:
stage: tests
script:
- npm install
- npm run lint:all
注意: 要在Gitlab CI中使提交工作,需要设置
Git shallow clone设置为0(见project)settings>CI / CD)。 这样,GitLab CI每次都会获取所有分支和标签。
贡献
改进总是受欢迎的!请随意记录错误, 编写建议或通过创建拉取请求贡献代码。 所有细节都在我们的投稿指南中列出。
看到 CONTRIBUTING.md.
许可证
版权所有(c)西门子2018 - 2026。
看到 LICENSE.md.