升级到vue 3后：“找不到模块'@ vue / compiler-sfc / package.json'”

编程问答 2022-06-22

问题描述

升级到vue 3后：
纱线添加vue @ next

我收到此错误：执行yarn electronic：serve时出现“找不到模块'@ vue / compiler-sfc / package.json” 

<link rel="icon">

我添加了vue-template-compiler，但问题仍然存在。

(base) marco@pc01:~/webMatters/electronMatters/GGC-Electron$ yarn add vue@next
yarn add v1.22.5
warning ../package.json: No license field
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.1.3: The platform "linux" is incompatible with this module.
info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > element-ui@2.13.2" has incorrect peer dependency "vue@^2.5.17".
warning " > vue-class-component@7.2.5" has incorrect peer dependency "vue@^2.0.0".
warning " > vuex@3.5.1" has incorrect peer dependency "vue@^2.0.0".
warning " > vuex-class@0.3.2" has incorrect peer dependency "vue@^2.5.0".
warning " > @vue/test-utils@1.0.5" has incorrect peer dependency "vue@2.x".
warning " > vue-types@2.0.1" has incorrect peer dependency "vue@^2.0.0".
[4/4] Building fresh packages...

success Saved lockfile.
success Saved 8 new dependencies.
info Direct dependencies
└─ vue@3.0.0-rc.10
info All dependencies
├─ @vue/compiler-core@3.0.0-rc.10
├─ @vue/compiler-dom@3.0.0-rc.10
├─ @vue/reactivity@3.0.0-rc.10
├─ @vue/runtime-core@3.0.0-rc.10
├─ @vue/runtime-dom@3.0.0-rc.10
├─ csstype@2.6.13
├─ estree-walker@2.0.1
└─ vue@3.0.0-rc.10
$ electron-builder install-app-deps
  • electron-builder  version=22.7.0
  • rebuilding native dependencies  dependencies=better-sqlite3@5.4.3,fd-lock@1.1.1,integer@2.1.0,sodium-native@2.4.9,utp-native@2.2.1,sodium-native@3.2.0,sodium-native@3.2.0
                                    platform=linux
                                    arch=x64
  • rebuilding native dependency  name=fd-lock version=1.1.1
  • rebuilding native dependency  name=better-sqlite3 version=5.4.3
  • rebuilding native dependency  name=integer version=2.1.0
  • rebuilding native dependency  name=sodium-native version=2.4.9
  • rebuilding native dependency  name=utp-native version=2.2.1
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
Done in 51.95s.


(base) marco@pc01:~/webMatters/electronMatters/GGC-Electron$ yarn electron:serve
yarn run v1.22.5
warning ../package.json: No license field
$ vue-cli-service electron:serve
 INFO  Starting development server...
 ERROR  Error: Cannot find module '@vue/compiler-sfc/package.json'
Require stack:
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/config/base.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/Service.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/bin/vue-cli-service.js
Error: Cannot find module '@vue/compiler-sfc/package.json'
Require stack:
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/config/base.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/Service.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/bin/vue-cli-service.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:1030:15)
    at Function.Module._load (internal/modules/cjs/loader.js:899:27)
    at Module.require (internal/modules/cjs/loader.js:1090:19)
    at require (internal/modules/cjs/helpers.js:75:18)
    at /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/config/base.js:115:30
    at /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/Service.js:236:40
    at Array.forEach (<anonymous>)
    at Service.resolveChainableWebpackConfig (/home/marco/webMatters/electronMatters/GGC-Electron/node_modules
/@vue/cli-service/lib/Service.js:236:26)
    at Service.resolveWebpackConfig (/home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service
/lib/Service.js:240:48)
    at PluginAPI.resolveWebpackConfig (/home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-
service/lib/PluginAPI.js:132:25)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

如果我将vue3降级为vue2，问题将消失：

(base) marco@pc01:~/webMatters/electronMatters/GGC-Electron$ yarn add vue-template-compiler
yarn add v1.22.5
warning ../package.json: No license field
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.1.3: The platform "linux" is incompatible with this module.
info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > element-ui@2.13.2" has incorrect peer dependency "vue@^2.5.17".
warning " > vue-class-component@7.2.5" has incorrect peer dependency "vue@^2.0.0".
warning " > vuex@3.5.1" has incorrect peer dependency "vue@^2.0.0".
warning " > vuex-class@0.3.2" has incorrect peer dependency "vue@^2.5.0".
warning " > @vue/test-utils@1.0.5" has incorrect peer dependency "vue@2.x".
warning " > vue-types@2.0.1" has incorrect peer dependency "vue@^2.0.0".
[4/4] Building fresh packages...
warning "vue-template-compiler" is already in "devDependencies". Please remove existing entry first before adding it to    
"dependencies".
success Saved 1 new dependency.
info Direct dependencies
└─ vue-template-compiler@2.6.12
info All dependencies
└─ vue-template-compiler@2.6.12
$ electron-builder install-app-deps
  • electron-builder  version=22.7.0
  • rebuilding native dependencies  dependencies=better-sqlite3@5.4.3,sodium-native@3.2.0
                                    platform=linux
                                    arch=x64
  • rebuilding native dependency  name=fd-lock version=1.1.1
  • rebuilding native dependency  name=better-sqlite3 version=5.4.3
  • rebuilding native dependency  name=integer version=2.1.0
  • rebuilding native dependency  name=sodium-native version=2.4.9
  • rebuilding native dependency  name=utp-native version=2.2.1
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
Done in 49.53s.
(base) marco@pc01:~/webMatters/electronMatters/GGC-Electron$ yarn electron:serve
yarn run v1.22.5
warning ../package.json: No license field
$ vue-cli-service electron:serve
 INFO  Starting development server...
 ERROR  Error: Cannot find module '@vue/compiler-sfc/package.json'
Require stack:
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/config/base.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/Service.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/bin/vue-cli-service.js
Error: Cannot find module '@vue/compiler-sfc/package.json'
Require stack:
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/config/base.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/Service.js
- /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/bin/vue-cli-service.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:1030:15)
    at Function.Module._load (internal/modules/cjs/loader.js:899:27)
    at Module.require (internal/modules/cjs/loader.js:1090:19)
    at require (internal/modules/cjs/helpers.js:75:18)
    at /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/config/base.js:115:30
    at /home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-service/lib/Service.js:236:40
    at Array.forEach (<anonymous>)
    at Service.resolveChainableWebpackConfig (/home/marco/webMatters/electronMatters/GGC-Electron/node_modules
/@vue/cli-service/lib/Service.js:236:26)
    at Service.resolveWebpackConfig (/home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-
service/lib/Service.js:240:48)
    at PluginAPI.resolveWebpackConfig (/home/marco/webMatters/electronMatters/GGC-Electron/node_modules/@vue/cli-
service/lib/PluginAPI.js:132:25)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

（基本）marco @ pc01：〜/ webMatters / electronMatters / GGC-Electron $ vue信息

(base) marco@pc01:~/webMatters/electronMatters/GGC-Electron$ yarn add vue@2
yarn add v1.22.5
warning ../package.json: No license field
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.1.3: The platform "linux" is incompatible with this module.
info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 1 new dependency.
info Direct dependencies
└─ vue@2.6.12
info All dependencies
└─ vue@2.6.12
$ electron-builder install-app-deps
  • electron-builder  version=22.7.0
  • rebuilding native dependencies  dependencies=better-sqlite3@5.4.3,sodium-native@3.2.0
                                    platform=linux
                                    arch=x64
  • rebuilding native dependency  name=fd-lock version=1.1.1
  • rebuilding native dependency  name=better-sqlite3 version=5.4.3
  • rebuilding native dependency  name=integer version=2.1.0
  • rebuilding native dependency  name=sodium-native version=2.4.9
  • rebuilding native dependency  name=utp-native version=2.2.1
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
  • rebuilding native dependency  name=sodium-native version=3.2.0
Done in 46.79s.

(base) marco@pc01:~/webMatters/electronMatters/GGC-Electron$ yarn electron:serve
yarn run v1.22.5
warning ../package.json: No license field
$ vue-cli-service electron:serve
 INFO  Starting development server...
Starting type checking service...
Using 1 worker with 2048MB memory limit
98% after emitting CopyPlugin

 DONE  Compiled successfully in 1419ms

如何解决问题？ 期待您的帮助

解决方法

vue-template-compiler是vue 2的旧软件包。安装@ vue / compiler-sfc https://www.npmjs.com/package/@vue/compiler-sfc，您应该会很好

,

使它工作的命令是：

yarn add vue@next
yarn add @vue/compiler-sfc -D

请注意-D，而不是devDependencies，将其添加到dependencies。

然后删除旧的依赖项：

yarn remove vue-template-compiler

请注意，vue@next当前指向Vue 3的最新版本，但将来可能会改变。

我在Vue论坛上发布了更长的解释：

https://forum.vuejs.org/t/after-upgrading-to-vue-3-cannot-find-module-vue-compiler-sfc-package-json/103424

更新：

对于使用npm而不是yarn的任何人，如果将第一个单词从yarn更改为npm，则同样的3个命令应该也可以使用。

,

我遇到了类似的问题，这次救了我的一个命令是：
vue update...
结果是我的 package.json 中有 @vue/cli-service 3... 并且需要最新版本 (4.5...)。上一个显然是在寻找错误的编译器（即不是以 sfc 结尾的那个）。

upgradevuejs3

相关问答

导入项目后报错问题
依赖报错 idea导入项目后依赖报错，解决方案：https://blog....
idea不能识别yaml文件
使用mybatis plus常见错误
错误1：代码生成器依赖和mybatis依赖冲突 启动项目时报错如下...
gradle常见问题与错误
错误1：gradle项目控制台输出为乱码 # 解决方案：https://bl...
Mybatis Plus传入参数0不起作用
错误还原：在查询的过程中，传入的workType为0时，该条件不起...
linux中make编译源码包失败
报错如下，gcc版本太低 ^ server.c:5346:31: 错误：‘struct...