柔和/纤细

问题描述

我正在尝试使用svelte开发一个应用。

我想设置漂亮的和eslint的文件，我安装了那些依赖项和Svelte for VS Code的扩展。

  "dependencies": {
    "eslint": "^7.7.0","eslint-plugin-svelte3": "^2.7.3","prettier": "^2.0.5","prettier-plugin-svelte": "^1.1.0","save-dev": "0.0.1-security","sirv-cli": "^1.0.0","stylelint": "^13.6.1"
  }

现在，我无法设置所有内容。

我做了

.eslintrc

{
  "plugins": ["eslint-plugin-svelte3"],"parserOptions": {
    "ecmaVersion": 6,"sourceType": "module","ecmaFeatures": {
      "jsx": true
    }
  },"rules": {
    "semi": "error"
  }
}

.prettierrc

{
  "tabWidth": 2,"semi": false,"singleQuote": true,"trailingComma": "es6"
}

，我想使用.vscode下的settings.json自动保存

{
  "editor.formatOnSave": true,"editor.defaultFormatter": "esbenp.prettier-vscode","editor.codeActionsOnSave": {
    "source.fixAll.eslint": true,"source.fixAll.prettier": true
  },"typescript.tsdk": "node_modules/typescript/lib","eslint.validate": ["svelte"]
}

现在我尝试使用它，但是保存时什么也没有发生，执行时也没有

"fix": "npx eslint --fix \"src/**/*.svelte\"","format": "npx prettier --write \"src/**/*.svelte\""

我想念什么吗？

解决方法

我无法帮助您解决eslint问题，但是会出现格式问题，因为在您的设置中，您告诉VSCode使用esbenp.prettier-vscode扩展名来格式化所有内容，而扩展名无法处理Svelte文件。将此添加到您的配置，它应该可以工作。

  "[svelte]": {
    "editor.defaultFormatter": "svelte.svelte-vscode"
  },

您也可以从npm安装prettier-plugin-svelte。重新加载后，如果该插件在同一node_modules文件夹中，并且将Svelte文件的格式推迟到该文件夹​​，Prettier会注意到该插件。

供参考： https://github.com/sveltejs/language-tools/tree/master/docs#my-code-does-not-get-formatted