Vue и Lint на бегу: как настроить? - PullRequest
Новая
       37

Vue и Lint на бегу: как настроить?

1 голос
/ 29 апреля 2019

При выполнении npm run serve.Я получил много предупреждений от линтера, что я не могу найти и настроить 

Module Warning (from ./node_modules/eslint-loader/index.js):
warning: Insert `;` (prettier/prettier) at src\main.js:1:22:
> 1 | import Vue from "vue"

Например, My VsCode настроен на использование 4 пробелов в качестве вкладки в расширении Prettier, но при запускетот же загрузчик предупреждает меня, потому что хочет использовать отступ с двумя пробелами.

Я не могу определить, ГДЕ / КАК сконфигурировать сам eslint-loader для настройки / отключения правил по мере необходимости. 

warning: Replace `····` with `··` (prettier/prettier) at src\main.js:22:1:
  20 | new Vue({
  21 |     router,
> 22 |     store,
     | ^
  23 |     render: h => h(App)
  24 | }).$mount("#app")

Я хочу отключить это, например, я хочу принудительно проверить 4 отступа, а не 2 пробела!

У меня есть расширение Vetur, и оно настроено на использование более красивого

Более красивогонастроен на использование 4 пробелаПоэтому я считаю, что нужные мне настройки не связаны с vscode.

1 Ответ

0 голосов
/ 29 апреля 2019

ЗАКЛЮЧИТЕЛЬНОЕ РЕШЕНИЕ - Кредиты: https://eslint.vuejs.org/user-guide/#editor-integrations, и много времени пробовал, пытался и сам пробовал

Я отключил более красивое расширение и отключил автоматическое форматирование в сравнении с кодом.

Я добавил этот фрагмент в рабочее пространство config (не глобально !!!!) 

{
    "eslint.validate": [
        {
            "language": "vue",
            "autoFix": true
        },
        {
            "language": "javascript",
            "autoFix": true
        },
        {
            "language": "javascriptreact",
            "autoFix": true
        }
    ],
    "eslint.autoFixOnSave": true,
    "editor.formatOnSave": false,
    "vetur.validation.template": false
}

Плюс, настройте более симпатичный / более симпатичный файл .eslintrc.js.

Например, посмотрите, как я использую prettier/prettier в разделе rules: 

module.exports = {
    root: true,
    env: {
        node: true
    },
    extends: [
        "plugin:vue/recommended",
        "eslint:recommended",
        "prettier/vue",
        "plugin:prettier/recommended",
    ],
    rules: {
        "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
        "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
        "prettier/prettier":[
            "error", 
            {
                "tabWidth"  : 4,
                "semi" : false,
            }
        ]
    },
    parserOptions: {
        parser: "babel-eslint"
    }
}

У меня установлены более симпатичные расширения и расширения eslint, как сказано в моем посте с вопросом.

См. Доступные опции здесь: https://prettier.io/docs/en/options.html

Таким образом, конфигурация работает как на vscode, так и работает как lint-on-run, как я хотел.

Отлично!

...