Taro 3.6.2 初始化项目

[irayslu]

相关平台

微信小程序

复现仓库

https://github.com/irayslu/taro-init3_6_2.git
小程序基础库: 3.6.2
使用框架: Vue 3

复现步骤

"dependencies": {
"@babel/runtime": "^7.7.7",
"@nutui/icons-vue-taro": "^0.0.9",
"@nutui/nutui-taro": "^4.0.0",
"@tarojs/components": "3.6.2",
"@tarojs/helper": "3.6.2",
"@tarojs/plugin-framework-vue3": "3.6.2",
"@tarojs/plugin-html": "3.6.2",
"@tarojs/plugin-platform-alipay": "3.6.2",
"@tarojs/plugin-platform-h5": "3.6.2",
"@tarojs/plugin-platform-jd": "3.6.2",
"@tarojs/plugin-platform-qq": "3.6.2",
"@tarojs/plugin-platform-swan": "3.6.2",
"@tarojs/plugin-platform-tt": "3.6.2",
"@tarojs/plugin-platform-weapp": "3.6.2",
"@tarojs/runtime": "3.6.2",
"@tarojs/shared": "3.6.2",
"@tarojs/taro": "3.6.2",
"vue": "^3.0.0"
},
"devDependencies": {
"@babel/core": "^7.8.0",
"@tarojs/cli": "3.6.2",
"@tarojs/mini-runner": "3.6.2",
"@tarojs/webpack-runner": "3.6.2",
"@types/webpack-env": "^1.13.6",
"@vue/babel-plugin-jsx": "^1.0.6",
"@vue/compiler-sfc": "^3.0.0",
"babel-preset-taro": "3.6.2",
"css-loader": "3.4.2",
"eslint": "^8.12.0",
"eslint-config-taro": "3.6.2",
"eslint-plugin-vue": "^8.0.0",
"style-loader": "1.3.0",
"stylelint": "9.3.0",
"unplugin-vue-components": "^0.23.0",
"vue-loader": "^17.0.0",
"webpack": "4.46.0"
}

期望结果

能运行

实际结果

Cannot find module 'vue/compiler-sfc'

环境信息

👽 Taro v3.6.2


  Taro CLI 3.6.2 environment info:
    System:
      OS: Windows 10
    Binaries:
      Node: 16.19.1 - C:\Program Files\nodejs\node.EXE
      Yarn: 1.22.19 - C:\Program Files\nodejs\yarn.CMD
      npm: 8.19.3 - C:\Program Files\nodejs\npm.CMD

[Chen-jj]

我们找 nutui 的同学帮忙看看的

[eiinu]

使用的 Vue 版本为 3.0.0，和 vue-loader@17 不兼容，可以升级 vue 到更高版本，比如 3.2.30 以上。
仓库模板里设置的是 ^3.0.0，正常情况应该会下载新版本才对，后续我们把模板内直接设置到更高的版本吧

[anyesu]

使用的 Vue 版本为 3.0.0，和 vue-loader@17 不兼容，可以升级 vue 到更高版本，比如 3.2.30 以上。 仓库模板里设置的是 ^3.0.0，正常情况应该会下载新版本才对，后续我们把模板内直接设置到更高的版本吧

这个问题是 pnpm8 导致的，pnpm 版本（ v8.0.0 到 v8.6.12 ）中 resolution-mode 的默认值是 lowest-direct ，即 安装依赖的最低版本 。 pnpm@8.7.0 已经回滚这个默认值了，所以出错的只有部分用户。

• installing a dependency, by default, installs the lowest matching version of that dependency pnpm/pnpm#6463

我是正好安装了 8.6.12 这个版本没更新过，就碰到这个问题了。

几个解决方法：

1. 内置模板升级 vue-loader 到一个不会报错的版本，比如 ^17.1.0

   • [Error] cannot find vue/compiler-sfc when using yarn workspace and lerna to install node_modules.  vuejs/vue-loader#2031

2. 内置模板升级 vue3 到一个不会报错的版本，比如 ^3.2.13

3. 内置模板中添加一个 .npmrc 文件，强制下载最高版本

   resolution-mode=highest
   

   • feat: set resolution-mode=highest in template .npmrc sveltejs/kit#9781

   如果大部分用户都升级到 pnpm8 最新版本了，那么这个配置又显得多余，需要再删掉。

4. 自己升级 pnpm 版本

   npm i -g @pnpm/exe

5. 在文档中指出这个问题，或者出错的时候打印警告，告知用户出错的真实原因以及解决办法。

   • Enforce resolution-mode=highest for pnpm versions 8.0.0 to 8.6.* ember-cli/ember-try#966

比较下来还是升级模板项目的 vue-loader 合适一点。