uni-app命令行编译小程序报错:Error: Vue3 项目暂不支持当前小程序

发布于 1周前 作者 htzhanglong 来自 Uni-App

uni-app命令行编译小程序报错:Error: Vue3 项目暂不支持当前小程序

我使用命令行编译微信小程序,node.js版本16,dcloud包升级至最新版。使用vue3。

运行

npm run build:mp-weixin

时报错:

Error: Vue3 项目暂不支持当前小程序
(base) (base) chris[@ChrisdeMacBook-Air](/user/ChrisdeMacBook-Air) frontend % npm ru  
n build:mp-weixin  

> chatgallery_v3@0.1.0 build:mp-weixin  
> cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build  

There are differences in the implementation mechanism of the browser kernels and custom components of each mini-program, and there may be compatibility issues with styles and layouts, please refer to: https://uniapp.dcloud.io/matter?id=mp  

✔  Start to compile the current project to the mp-weixin platform...  
 ERROR  Error: Vue3 项目暂不支持当前小程序  
Error: Vue3 项目暂不支持当前小程序  
    at Object.getMPRuntimePath (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/uni-cli-shared/lib/platform.js:152:15)  
    at Object.<anonymous> (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/webpack-uni-mp-loader/lib/plugin/generate-component.js:24:80)  
    at Module._compile (node:internal/modules/cjs/loader:1198:14)  
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1252:10)  
    at Module.load (node:internal/modules/cjs/loader:1076:32)  
    at Function.Module._load (node:internal/modules/cjs/loader:911:12)  
    at Module.require (node:internal/modules/cjs/loader:1100:19)  
    at require (node:internal/modules/cjs/helpers:119:18)  
    at Object.<anonymous> (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/webpack-uni-mp-loader/lib/plugin/index-new.js:17:27)  
    at Module._compile (node:internal/modules/cjs/loader:1198:14)  
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1252:10)  
    at Module.load (node:internal/modules/cjs/loader:1076:32)  
    at Function.Module._load (node:internal/modules/cjs/loader:911:12)  
    at Module.require (node:internal/modules/cjs/loader:1100:19)  
    at require (node:internal/modules/cjs/helpers:119:18)  
    at createUniMPPlugin (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/lib/mp/index.js:26:30)  
    at webpackConfig (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/lib/mp/index.js:193:7)  
    at /Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/lib/configure-webpack.js:183:31  
    at /Users/chris/development/ChatGallery/frontend/node_modules/@vue/cli-service/lib/Service.js:283:21  
    at Array.forEach (<anonymous>)  
    at Service.resolveWebpackConfig (/Users/chris/development/ChatGallery/frontend/node_modules/@vue/cli-service/lib/Service.js:280:30)  
    at PluginAPI.resolveWebpackConfig (/Users/chris/development/ChatGallery/frontend/node_modules/@vue/cli-service/lib/PluginAPI.js:132:25)  
    at module.exports (/Users/chris/development/ChatGallery/frontend/node_modules/@vue/cli-service/lib/commands/build/resolveAppConfig.js:51:14)  
    at getWebpackConfig (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/commands/build.js:89:88)  
    at getWebpackConfigs (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/commands/build.js:122:13)  
    at build (/Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/commands/build.js:161:26)  
    at /Users/chris/development/ChatGallery/frontend/node_modules/@dcloudio/vue-cli-plugin-uni/commands/build.js:80:11  
    at Service.run (/Users/chris/development/ChatGallery/frontend/node_modules/@vue/cli-service/lib/Service.js:262:12)  
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

1 回复

在处理 uni-app 编译小程序时遇到 “Error: Vue3 项目暂不支持当前小程序” 的错误通常意味着你正在尝试使用 Vue 3 语法或特性来编译一个不支持 Vue 3 的小程序平台。uni-app 支持多个平台,但不同平台对 Vue 3 的支持情况有所不同。以下是一些可能的解决方案和代码示例,帮助你定位和解决问题。

1. 检查平台配置

首先,确保你的 manifest.json 文件中配置的目标平台支持你正在使用的 Vue 版本。例如,如果你正在编译微信小程序,检查 mp-weixin 的配置是否与你的项目 Vue 版本兼容。

{
  "mp-weixin": {
    // 确保这里的配置与你的项目 Vue 版本匹配
    "appid": "your-app-id",
    "setting": {
      // ...其他配置
    }
  }
}

2. 条件编译

如果你的项目中同时包含了 Vue 2 和 Vue 3 的代码,你可以使用条件编译来区分不同平台的代码。

<template>
  <!-- #ifdef MP-WEIXIN -->
  <!-- 使用 Vue 2 语法 -->
  <view>{{ message }}</view>
  <!-- #else -->
  <!-- 使用 Vue 3 语法(如果支持) -->
  <template #header>
    <div>{{ message }}</div>
  </template>
  <!-- #endif -->
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello, uni-app!'
    };
  }
}
</script>

3. 降级 Vue 版本

如果目标平台不支持 Vue 3,考虑将项目降级到 Vue 2。这通常涉及到修改 vue.config.jsbabel.config.js 文件,以及替换所有不兼容的 Vue 3 语法。

# 安装 Vue 2 依赖
npm install vue@2 vue-template-compiler@2 --save

并在你的项目入口文件中确保使用的是 Vue 2:

import Vue from 'vue';

new Vue({
  // ...Vue 2 实例配置
});

4. 检查 uni-app 版本

确保你使用的 uni-app 版本是最新的,因为新版本可能会增加对更多平台或 Vue 3 特性的支持。

# 更新 uni-app CLI
npm update -g @dcloudio/uni-cli

总结

由于直接修改代码或配置可能涉及项目结构的较大调整,建议首先查阅 uni-app 官方文档或社区论坛,了解目标平台对 Vue 3 的具体支持情况,再决定采取哪种策略。如果目标平台确实不支持 Vue 3,降级到 Vue 2 可能是最快速的解决方案。

回到顶部