vue.js 无法找到页面

kb5ga3dv  于 2023-02-09  发布在  Vue.js
关注(0)|答案(5)|浏览(338)

我当时正在用Vue为我的应用程序编写代码,一切都运行得很完美。然后我开始创建子组件,我再也无法刷新localhost了。
现在它说:

  • "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

根据www.example.com-我尝试添加包含此内容的jsconfig.json文件。(我删除了所有子组件,因此只剩下这些vue文件(About、Todo、App)。)https://vuejs.github.io/vetur/guide/setup.html#project-setup - I tried to add the jsconfig.json file with this content. (I deleted all the child components so I only have these vue files (About, Todo, App) left.)

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

还是没有。有人有什么想法吗?谢谢〈3

whitzsjs

whitzsjs1#

首先,在Visual Studio代码中键入:
Ctrl + Shift+鼠标左键
此命令将打开此窗口

在搜索栏中键入:settings json,如下所示:

打开第一个选项:"打开设置(JSON)"。
现在,在JSON文件中添加以下内容:"vetur.ignoreProjectWarning": true,在文件末尾,如下所示:

重新启动Visual Studio代码,操作完成!

pvcm50d1

pvcm50d12#

安装EsLint扩展模块应可解决您的问题
如果您使用的是VS Code,请按发布者搜索EsLint扩展模块:"Dirk Baeumer",安装并批准安装以启动EsLint服务器
或者在工作区的终端npm install eslint中运行此命令
修改package.json文件,服务器将再次启动
有关EsLint扩展模块的详细信息,可以查看https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
祝你好运!

lvmkulzt

lvmkulzt3#

在项目外部添加**“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'
      ]
    }
  ]
}
l7wslrjt

l7wslrjt4#

在VSCode中
控制键+p
打开设置. json
添加此行:

"vetur.ignoreProjectWarning": true,

这将忽略该错误。

jum4pzuy

jum4pzuy5#

在VS代码中,如果实际代码在子文件夹中(例如,您有一个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

相关问题