vue3 vite

[yongheng2016]

vue3 vite 引用vue文件报错 vue-cli 通过配套vscode插件消除

• volar eslint prettier vscode setting 配置

{
    "vetur.validation.template": false,
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "[vue]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
}

• 官方推荐
  • VSCode
  • Volar (and disable Vetur)
  • TypeScript Vue Plugin (Volar).

---

找不到模块“./App.vue”或其相应的类型声明。

解决：安装

• TypeScript Vue Plugin (Volar)
• Vue Language Features (Volar)

module "d:/work/code/handover/vue3_dir/vue-project/src/components/HelloWorld.vue"
'HelloWorld' is declared but its value is never read.Vetur(6133)
File 'd:/work/code/handover/vue3_dir/vue-project/src/components/HelloWorld.vue' is not a module.Vetur(2306)

解决：禁用

• Vetur

TODO: settings.json 禁用vetur

{
    "editor.formatOnSave": true,
    "vetur.completion.autoImport": false,
    "vetur.format.enable": false,
    "vetur.format.defaultFormatter.js": "none",
    "vetur.format.defaultFormatter.css": "none",
    "vetur.format.defaultFormatter.html": "none",
    "vetur.format.defaultFormatter.less": "none",
    "vetur.format.defaultFormatter.postcss": "none",
    "vetur.format.defaultFormatter.pug": "none",
    "vetur.format.defaultFormatter.sass": "none",
    "vetur.format.defaultFormatter.scss": "none",
    "vetur.format.defaultFormatter.stylus": "none",
    "vetur.format.defaultFormatter.ts": "none",
    "vetur.trace.server": "off",
    "vetur.format.options.useTabs": false,
    "vetur.format.styleInitialIndent": false,
    "vetur.format.scriptInitialIndent": false,
    "vetur.validation.interpolation": false,
    "vetur.validation.script": false,
    "vetur.validation.style": false,
    "vetur.validation.template": false,
    "vetur.validation.templateProps": false,
    "vetur.experimental.templateInterpolationService": false,
    "vetur.languageFeatures.updateImportOnFileMove": false,
    "vetur.languageFeatures.semanticTokens": false,
    "vetur.languageFeatures.codeActions": false,
    "vetur.underline.refValue": false,
}

---

• .vscode/extensions.json

{
    "recommendations": [
        "dbaeumer.vscode-eslint",
        "esbenp.prettier-vscode",
        "vue.vscode-typescript-vue-plugin",
        "vue.volar"
    ]
}