vue3 错误记录

1、使用<style lang="scss" scoped> 错误

异常：

19:40:26 [vite] Internal server error: Preprocessor dependency "sass-embedded" not found. Did you install it? Try `yarn add -D sass-embedded`. Plugin: vite:css File: D:/devproject/web/vue3_book_codes/chapter3/my-project/src/views/5_6_v-cloak/Bloak.vue?vue&type=style&index=0&scoped=cdcc94e4&lang.scss

原因：

1. The errorPreprocessor dependency "sass-embedded" not foundindicates that the Sass preprocessor is missing from your project dependencies. Since yourBloak.vuefile uses<style lang="scss">, Vite requires a Sass compiler to process it.

解决：

yarn add -D sass-embedded

2、[Vue warn]: Failed to resolve component: Bevent

App.vue:28 [Vue warn]: Failed to resolve component: Bevent If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. at <App>

原因：

import BEvent from "./views/5_8_v-on/BEvent.vue";

<Bevent></Bevent>

组件名大小写不一致，Bevent ≠ BEvent

3、vue add typescript 报错

🚀 Invoking generator for @vue/cli-plugin-typescript... ERROR Error: Cannot find module '@vue/cli-service/generator/template/src/App.vue' from 'D:\devproject\web\vue3_book_codes\chapter9\screen-app\node_modules\@vue\cli-plugin-typescript\generator\template\src' Error: Cannot find module '@vue/cli-service/generator/template/src/App.vue' from 'D:\screen-app\node_modules\@vue\cli-plugin-typescript\generator\template\src' at resolve.resolveSync [as sync] (C:\Users\kkk\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\resolve\lib\sync.js:115:15) at renderFile (C:\Users\kkk\AppData\Roaming\npm\node_modules\@vue\cli\lib\GeneratorAPI.js:518:17) at C:\Users\kyg\AppData\Roaming\npm\node_modules\@vue\cli\lib\GeneratorAPI.js:303:27 at async Generator.resolveFiles (C:\Users\kkk\AppData\Roaming\npm\node_modules\@vue\cli\lib\Generator.js:313:7) at async Generator.generate (C:\Users\kkk\AppData\Roaming\npm\node_modules\@vue\cli\lib\Generator.js:205:5) at async runGenerator (C:\Users\kkk\AppData\Roaming\npm\node_modules\@vue\cli\lib\invoke.js:111:3) at async invoke (C:\Users\kkk\AppData\Roaming\npm\node_modules\@vue\cli\lib\invoke.js:92:3)

原因：

不是vue create新建的标准 Vue CLI 项目，而是在一个已有项目（甚至可能是 Vite 或已经修改过模板）上执行了

vue add typescript

使用 Vite 创建的 Vue 3 项目，不能使用vue add typescript