Vetur 找不到 package.json

Posted 2023-03-07

【中文标题】Vetur 找不到 package.json

【英文标题】：Vetur can't find package.json

【发布时间】：2021-07-03 06:07:47

【问题描述】：

我正在使用 Vue 为我的应用程序编写代码，并且一切正常。然后我开始创建子组件，我不能再刷新本地主机了。

现在它说：

“Vetur 找不到 'package.json” & “Vetur 找不到 'tsconfig.json' 或 'jsconfig.json”

当我尝试在 cmd 中“npm run serve”时，我得到了这个：

C:\Users\cmana\Desktop\WebDeveloper\Vue app\vuetify-todo>npm run serve
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path C:\Users\cmana\Desktop\WebDeveloper\Vue app\vuetify-todo\package.json
npm ERR! errno -4058
npm ERR! enoent ENOENT: no such file or directory, open 'C:\Users\cmana\Desktop\WebDeveloper\Vue app\vuetify-todo\package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent 

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\cmana\AppData\Roaming\npm-cache\_logs\2021-04-07T12_03_13_953Z-debug.log

根据https://vuejs.github.io/vetur/guide/setup.html#project-setup - 我尝试添加带有此内容的 jsconfig.json 文件。 （我删除了所有子组件，所以我只剩下这些vue文件（About，Todo，App）。）

  "include": [
    "./src/views/About.vue",
    "./src/views/Todo.vue",
    "./src/App.vue"
  ]

还是什么都没有。有人有什么想法吗？谢谢

【问题讨论】：

好的，我解决了。有两个问题。 1）我插入了不是我的根文件夹的工作区文件夹。 （它比上面一层。）所以我删除了它，然后我插入了根文件夹。然后它终于能够找到 package.json。 2）我在我的源文件夹中创建了jsconfig.json，而不是在根文件夹中......所以我把它移到那里并且它工作......

【参考方案1】：

安装 EsLint 扩展程序应该可以解决您的问题

如果你在 VS Code 上，通过发布者搜索 EsLint 扩展：“Dirk Ba​​eumer”，安装并批准安装以启动 EsLint 服务器

或者在终端中运行它 npm install eslint 在您的工作区中

package.json 文件被修改，您的服务器将再次启动

有关 EsLint 扩展的更多信息，您可以查看 https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint

祝你好运！

【讨论】：

npm install eslint 是唯一对我有帮助的解决方案！

【参考方案2】：

在您的项目之外添加 "vetur.config.js"。

在下面的这个例子中，"vetur.config.js"被添加到项目之外"vueProject"：

缩小 "vueProject" 看起来更清晰：

然后，将下面的代码粘贴到 "vetur.config.js"：

// vetur.config.js
/** @type import('vls').VeturConfig */
module.exports = 
  // **optional** default: ``
  // override vscode settings
  // Notice: It only affects the settings used by Vetur.
  settings: 
    "vetur.useWorkspaceDependencies": true,
    "vetur.experimental.templateInterpolationService": true
  ,
  // **optional** default: `[ root: './' ]`
  // support monorepos
  projects: [
    './packages/repo2', // shorthand for only root.
    
      // **required**
      // Where is your project?
      // It is relative to `vetur.config.js`.
      root: './packages/repo1',
      // **optional** default: `'package.json'`
      // Where is `package.json` in the project?
      // We use it to determine the version of vue.
      // It is relative to root property.
      package: './package.json',
      // **optional**
      // Where is TypeScript config file in the project?
      // It is relative to root property.
      tsconfig: './tsconfig.json',
      // **optional** default: `'./.vscode/vetur/snippets'`
      // Where is vetur custom snippets folders?
      snippetFolder: './.vscode/vetur/snippets',
      // **optional** default: `[]`
      // Register globally Vue component glob.
      // If you set it, you can get completion by that components.
      // It is relative to root property.
      // Notice: It won't actually do it. You need to use `require.context` or `Vue.component`
      globalComponents: [
        './src/components/**/*.vue'
      ]
    
  ]

【参考方案3】：

首先，在 Visual Studio 代码中，输入：

Ctrl + Shift + p

这个命令，会打开这个窗口

在搜索栏中输入：settings json，如下所示：

打开第一个选项：“打开设置（JSON）”。

现在，在 JSON 文件中，在文件末尾添加："vetur.ignoreProjectWarning": true,，如下所示：

重启 Visual Studio Code，大功告成！

【讨论】：

谢谢先生。完美。

【参考方案4】：

在 VSCode 中

ctrl + p 打开 setting.json 添加这一行：

  "vetur.ignoreProjectWarning": true,

这将忽略错误。

【讨论】：

也谢谢你。感谢您的帮助。 :)

【参考方案5】：

在 VS Code 中，如果实际代码位于子文件夹中（例如，您有一个 monorepo），您可以在根目录中添加 vetur.config.js，如下所示。

module.exports = 
    projects: [
      
        root: './frontend', // root of your vue project (should contain package.json)
        package: './package.json', // Relative to root property, don't change this.
        tsconfig: './tsconfig.json',  // Relative to root property, don't change this.
      
    ]
  

详情请咨询Vetur Reference。