1.打开hbuilder软件，新建uniapp项目

2.关联unicloud服务空间

2.1 项目文件夹鼠标右键，打开uicloud web控制台

2.2 注册HBuilder 账号

dcloud账号注册链接

2.3 新建服务空间

大约等待2分钟，服务空间初始化完毕！就可以使用了。

2.4 hbuilder项目中关联服务空间

2.5 确保登录账号和关联服务空间

2.6 运行项目

3.安装uview插件

uview官网

3.1 使用Hbuilder X方式进行安装

在dcloud插件市场中找到uview
uview插件

需要登录dcloud账号！！！


选择项目，导入uview插件。

3.2 项目中进行uview插件的配置

配置步骤

1. 引入uView主JS库
   在项目根目录中的main.js中，引入并使用uView的JS库，注意这两行要放在import Vue之后。

    ```
    // main.js
    import uView from '@/uni_modules/uview-ui'
    Vue.use(uView)
    ```
   

2. 在引入uView的全局SCSS主题文件
   在项目根目录的uni.scss中引入此文件。

    ```
    
    /* uni.scss */
    @import '@/uni_modules/uview-ui/theme.scss';
    ```
   

3. 引入uView基础样式
   注意！

   在App.vue中首行的位置引入，注意给style标签加入lang="scss"属性

    ```
    
    <style lang="scss">
    	/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
    	@import "@/uni_modules/uview-ui/index.scss";
    </style>
    ```
   

4. 配置easycom组件模式
   此配置需要在项目根目录的pages.json中进行。
   温馨提示

   uni-app为了调试性能的原因，修改easycom规则不会实时生效，配置完后，您需要重启HX或者重新编译项目才能正常使用uView的功能。
   请确保您的pages.json中只有一个easycom字段，否则请自行合并多个引入规则。
   如果您是通过uni_modules形式引入uView，可以忽略此配置

   // pages.json
   {
   	// 如果您是通过uni_modules形式引入uView，可以忽略此配置
   	"easycom": {
   		"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue"
   	},
   	
   	// 此为本身已有的内容
   	"pages": [
   		// ......
   	]
   }
   

3.3 测试uview是否安装成功。

首页中引入uview插件的button按钮

<u-button type="primary" text="确定"></u-button>

如果显示如下，证明安装配置成功；可以使用uveiw的其他组件了。