vite+vue3+pinia遇到Pinia外部属性问题

Question

代码如下：

红色波浪线提示，浏览器是可以正常读取使用，但就是在提示说不存在，如何解决

Answer 1

• 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7754745
• 你也可以参考下这篇文章：vite2 + Vue3中 使用 pinia
• 除此之外, 这篇博客: Vue3--Vite和Pinia中的 2.3、路由使用 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

• 1.创建文件夹用来容纳 页面views与路由规则router

  2. 新建路由页面

  3.配置路由规则--与下载路由

  pnpm install --save vue-router@4

  如果报错===》下载时不用携带后面的@4

  4 设置路由出口

  在app.vue中设置 router-view

  5 注入路由

  在main.js中引用使用路由

  import router from './router'
  
  createApp(App).use(router).mount('#app')

• 以下回答由chatgpt基于相关博客总结生成:

  针对这个问题，可以尝试以下方法：

  1. 检查Pinia的导入是否正确。可以再次查看示例，并检查您的导入是否与示例相同。如果示例代码中使用了import { useCounterStore } from '@/stores/counter'，那么您的代码中也应该使用相同的导入方法。

  2. 确保正确安装了Vite、Vue3、Pinia。可以检查package.json中的依赖项是否正确，以及是否正确安装了dev依赖项。如果还没有按照正确格式安装，请先按照文档说明安装。

  3. 检查你的编辑器是否正确识别了Pinia的类型。有些编辑器需要手动安装类型定义，以便正确识别Pinia的类型。请查看您使用的编辑器的文档，这里以VS Code为例，在项目中，可以在终端中输入以下命令：npm install @pinia/typings -D，安装完毕后，在你的编辑器中重新启动类型检查。

  4. 如果您使用的是Vue模板语法，请确保您已正确注册了Pinia插件。在Vue3中，Pinia需要通过createApp方法进行注册。您可以按照以下步骤进行注册：

  5. 在主文件中导入createPinia

  6. 使用app.use(createPinia())来注册

  以Vite为例，代码示例如下：

  // main.js
  import { createApp } from 'vue'
  import App from './App.vue'
  import { createPinia } from 'pinia' // 导入 createPinia 方法
  
  const app = createApp(App)
  app.use(createPinia()) // 注册 Pinia 插件
  
  app.mount('#app')
  

  1. 如果您使用的是TypeScript，请查看您的tsconfig.json配置是否正确。在TypeScript中，由于Pinia采用Composition API，需要启用"experimentalDecorators": true和"strictPropertyInitialization": false。可以在你的tsconfig.json中，按照以下配置进行修改：

  {
    "compilerOptions": {
      // ...
      "experimentalDecorators": true,
      "strictPropertyInitialization": false,
      // ...
    }
  } 
  

  以上就是针对Pinia外部属性问题的解决方案，根据不同的情况进行适当的调整。如果以上方法都不能解决您的问题，建议查询Pinia文档或相关社区论坛寻求更详细的解决方案。