Vscode创建uniapp小程序并使用uView组件库，适合小白！！

1. 创建项目

vue create -p dcloudio/uni-preset-vue my-uniapp

2. 启动项目

首先将package.json中的serve命令修改为以下代码

"serve": "npm run dev:mp-weixin"

启动项目

npm run serve

运行结束后项目多了一个dist包：

3. 微信开发者工具打开

微信开发者工具下载地址：developers.weixin.qq.com/miniprogram…

点击添加项目

打开地址为：项目所在目录\dist\dev\mp-weixin

本人项目地址为 : D:\Fronted/my-uniapp\dist\dev\mp-weixin

打开的项目地址错误则会报错！！！！

4.引入Uview框架

1. 安装Uview

npm install uview-ui@2.0.31

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

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

3. src/uni.scss中引入以下文件

@import 'uview-ui/theme.scss';

4. App.vue中首行的位置引入，注意给style标签加入lang="scss"属性,这个需要下载sass-loader

<style lang="scss">
	/*每个页面公共css */
	@import "uview-ui/index.scss";
</style>

5. src/pages.json中添加，这一步添加完需要重新启动项目

{
"easycom": {
		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
	},
 // ....其他的
}

6. 引入组件查看是否生效

<u-icon name="photo"></u-icon>

接下来就是编程了。。。。。。。。。。