HBuilder创建uniapp默认项目导入uview(胎教)

1:更新HBuilder

建议更新

2:更新插件

我本人在没有更新插件的情况下报错了,找到了**这个大佬**解决问题,所以建议更新插件

先卸载uni-app(Vue2)编译
在这里插入图片描述

再重新安装 uni-app(Vue2)
在这里插入图片描述

新建uniapp项目

新建test项目
在这里插入图片描述

创建成功之后,右键项目选择在外部资源器中打开
在这里插入图片描述

在外部资源器中打开是防止在HBuilder的终端打开cmd权限不足等各种问题

复制项目地址
在这里插入图片描述
然后以管理员身份运行cmd窗口(不同电脑可能找不到**链接在这**)

打开之后,切换项目所在盘,cd 进入刚刚复制的项目地址
在这里插入图片描述

以npm的方式安装uview

教程来自uview的**官方教程**
这里有一个很重要的点,我们是使用HBuilder创建的,可以去项目中查看有没有package.json文件
没有的话先在cmd窗口运行

npm init -y

之后按教程输入命令即可,后续的配置步骤不能忘记

在这里插入图片描述

UniApp 项目中安装和引入 **uview-plus** 组件库,可以按照以下步骤进行操作: ### 安装依赖 首先,通过 npm 或 yarn 安装 uview-plus 及其相关依赖包。 ```bash npm install uview-plus npm install dayjs clipboard ``` 如果项目中需要使用 SCSS 主题文件,则还需要安装 `sass` 和 `sass-loader`: ```bash npm install sass@1.63.2 -D npm install sass-loader@10.4.1 -D ``` ### 引入 uview-plus #### 在 `main.js` 中引入并使用 uview-plus 确保在 `main.js` 文件中正确引入并注册 uview-plus。以下是基于 Vue 3 的示例代码: ```javascript import App from './App' import uviewPlus from 'uview-plus' // #ifdef VUE3 import { createSSRApp } from 'vue' export function createApp() { const app = createSSRApp(App) app.use(uviewPlus) return { app } } // #endif ``` #### 配置 SCSS 主题文件 在 `uni.scss` 文件中引入 uview-plus 提供的全局 SCSS 主题文件: ```scss @import 'uview-plus/theme.scss'; ``` #### 配置 easycom(可选) 为了简化组件调用过程,可以通过配置 `easycom` 来自动扫描并注册组件。在 `pages.json` 文件中添加如下配置: ```json { "easycom": { "autoscan": true, "custom": { "^u--(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue", "^up-(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue", "^u-([^-].*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue" } } } ``` 这样配置后,在页面中可以直接使用 uview-plus 组件而无需手动导入[^3]。 ### 注意事项 - 确保所有必要的依赖都已正确安装。 - 如果遇到问题,请尝试重新编译项目或刷新页面。 - 检查是否按照官方文档进行了正确的设置,特别是与样式相关的部分。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

爷可是个天才

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值