引入uin-ui组件后，uni-app微信小程序可以正确运行，而H5不行（错误信息如下）

引入uin-ui组件后，uni-app微信小程序可以正确运行，而H5不行（错误信息如下）

开发环境 版本号 项目创建方式
Windows Windows 10 CLI
家庭中文版 1809
浏览器 版本
Chrome
版本 133.0.6943.142
CLI @vue/cli 5.0.8 
bug描述：

https://uniapp.dcloud.net.cn/component/uniui/quickstart.html#npm%E5%AE%89%E8%A3%85  

我按照npm模块一步一步安装，最后在微信小程序端成功运行，但是运行H5命令时，一直报错  

error when starting dev server:
Error: Failed to resolve entry for package "[@dcloudio](/user/dcloudio)/uni-ui". The package may have incorrect main/module/exports specified in its package.json.
at packageEntryFailure (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:48302:17)
at resolvePackageEntry (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:48299:5)
at tryNodeResolve (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:48069:20)
at Context.resolveId (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:47819:28)
at Object.resolveId (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:51096:64)
at async file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68287:21
at async file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:51768:20
at async addManuallyIncludedOptimizeDeps (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:52880:31)
at async createDepsOptimizer (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:52016:9)
at async initDepsOptimizer (file:///D:/Eeee/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:51912:9)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

更多关于引入uin-ui组件后，uni-app微信小程序可以正确运行，而H5不行（错误信息如下）的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于引入uin-ui组件后，uni-app微信小程序可以正确运行，而H5不行（错误信息如下）的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个问题是因为H5平台下uni-ui组件的解析问题导致的。主要原因是Vite构建工具无法正确解析uni-ui的入口文件。

解决方案：

  1. 确保你的项目是使用Vue3创建的，uni-ui需要Vue3环境

  2. 检查package.json中是否正确安装了uni-ui：

"@dcloudio/uni-ui": "^1.4.20"
  1. 在vite.config.js中添加以下配置：
import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'

export default defineConfig({
  plugins: [uni()],
  resolve: {
    alias: {
      '@dcloudio/uni-ui': '@dcloudio/uni-ui/lib'
    }
  }
})
  1. 确保组件是按需引入的，在pages.json中配置easycom：
"easycom": {
  "autoscan": true,
  "custom": {
    "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue"
  }
}
回到顶部