为 TSLint (NestJs) 和 ESLint (VueJs)

我正在使用带有 Typescript / TSLint 的 NestJs 和带有 Javascript / ESLint 的 VueJs。我的 VSCode 扩展是 ESLint、TSLint、Prettier 和 Vetur。开发后端时一切都很好,代码的格式也很好。使用 Vue 开发时,我使用了 airbnb linter 配置,但我遇到了问题。


假设我有这个 vue 实例


<script>

export default {

  components: {},

  data() {

    return {

      foo: '',

    };

  },

};

</script>

然后我保存文件,格式化程序将代码更新为


<script>

export default {

  components: {},

  data() {

    return {

      foo: ""

    };

  }

};

</script>

我无法运行代码,因为 linter 基于 airbnb linter 配置抛出错误。虽然它不应该修复代码,因为我已经使用了 airbnb 样式指南。


我使用设置同步,因此我可以共享我的整个 VSCode 设置以进行复制。这些是我的设置


{

    "vetur.validation.template": true,

    "eslint.autoFixOnSave": true,

    // ...

    "javascript.updateImportsOnFileMove.enabled": "always",

    // ...

    "typescript.updateImportsOnFileMove.enabled": "always",

    "prettier.singleQuote": true,

    "prettier.trailingComma": "es5",

    "prettier.useTabs": true,

    "editor.formatOnSave": true,

    // ...

    "vetur.format.defaultFormatter.html": "prettier"

}

你可以在这里看到整个要点


https://gist.github.com/matthiashermsen/9620a315960fa7b9e31bf6cda8583e84


那么 Prettier 是否在为 TSLint 和 ESLint 苦苦挣扎?我想为 Typescript 和 Javascript 项目设置一个标准设置。


我还尝试使用 prettier 作为 linter 创建一个新的 Vue 项目,并且一切正常。因此,它似乎只是在与 airbnb linter 配置作斗争。


有任何想法吗?感谢帮助!


手掌心
浏览 295回答 1
1回答

开心每一天1111

根据这篇文章TSLint 已于 2019 年弃用。您必须使用 ESLint 进行打字稿。我分享我的配置,您可以使用它或编辑它的某些部分。tsconfig.json:{&nbsp; "compilerOptions": {&nbsp; &nbsp; &nbsp; // Target latest version of ECMAScript.&nbsp; &nbsp; &nbsp; "target": "esnext",&nbsp; &nbsp; &nbsp; // path to output directory&nbsp; &nbsp; &nbsp; "outDir": "./dist",&nbsp; &nbsp; &nbsp; // enable strict null checks as a best practice&nbsp; &nbsp; &nbsp; "strictNullChecks": true,&nbsp; &nbsp; &nbsp; // Search under node_modules for non-relative imports.&nbsp; &nbsp; &nbsp; "moduleResolution": "node",&nbsp; &nbsp; &nbsp; // Process & infer types from .js files.&nbsp; &nbsp; &nbsp; "allowJs": true,&nbsp; &nbsp; &nbsp; // Don't emit; allow Babel to transform files.&nbsp; &nbsp; &nbsp; "noEmit": true,&nbsp; &nbsp; &nbsp; // Enable strictest settings like strictNullChecks & noImplicitAny.&nbsp; &nbsp; &nbsp; "strict": true,&nbsp; &nbsp; &nbsp; // Import non-ES modules as default imports.&nbsp; &nbsp; &nbsp; "esModuleInterop": true,&nbsp; &nbsp; &nbsp; // use typescript to transpile jsx to js&nbsp; &nbsp; &nbsp; "baseUrl": "./src",&nbsp; &nbsp; &nbsp; "module": "esnext",&nbsp; &nbsp; &nbsp; "removeComments": true,&nbsp; &nbsp; &nbsp; "alwaysStrict": true,&nbsp; &nbsp; &nbsp; "allowUnreachableCode": false,&nbsp; &nbsp; &nbsp; "noImplicitAny": true,&nbsp; &nbsp; &nbsp; "noImplicitThis": true,&nbsp; &nbsp; &nbsp; "noUnusedLocals": true,&nbsp; &nbsp; &nbsp; "noUnusedParameters": true,&nbsp; &nbsp; &nbsp; "noImplicitReturns": true,&nbsp; &nbsp; &nbsp; "noFallthroughCasesInSwitch": true,&nbsp; &nbsp; &nbsp; "forceConsistentCasingInFileNames": true,&nbsp; &nbsp; &nbsp; "importHelpers": true,&nbsp; &nbsp; &nbsp; "typeRoots": [&nbsp; &nbsp; &nbsp; &nbsp; "src/@types",&nbsp; &nbsp; &nbsp; &nbsp; "node_modules/@types"&nbsp; &nbsp; &nbsp; ]&nbsp; }}.eslintrc.jsmodule.exports = {&nbsp; &nbsp; parser: '@typescript-eslint/parser',&nbsp; &nbsp; plugins: ['@typescript-eslint'],&nbsp; &nbsp; extends: [&nbsp; &nbsp; &nbsp; &nbsp; "eslint:recommended",&nbsp; &nbsp; &nbsp; &nbsp; "plugin:@typescript-eslint/eslint-recommended",&nbsp; &nbsp; &nbsp; &nbsp; "plugin:@typescript-eslint/recommended",&nbsp; &nbsp; &nbsp; &nbsp; "plugin:react/recommended",&nbsp; &nbsp; &nbsp; &nbsp; "plugin:prettier/recommended",&nbsp; &nbsp; &nbsp; &nbsp; "prettier/@typescript-eslint",&nbsp; &nbsp; ],&nbsp; &nbsp; env: {&nbsp; &nbsp; &nbsp; &nbsp; "browser": true,&nbsp; &nbsp; &nbsp; &nbsp; "es6": true,&nbsp; &nbsp; &nbsp; &nbsp; "node": true&nbsp; &nbsp; },&nbsp; &nbsp; overrides: [&nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "files": ["*.tsx"],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "rules": {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "react/prop-types": "off"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "files": ["*.js"],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "rules": {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "@typescript-eslint/no-var-requires": "off"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; ]}.prettierrc.jsmodule.exports =&nbsp; {&nbsp; semi:&nbsp; true,&nbsp; trailingComma:&nbsp; 'all',&nbsp; singleQuote:&nbsp; true,&nbsp; printWidth:&nbsp; 120,&nbsp; tabWidth:&nbsp; 2,};
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript