- 以下是针对webstorm用户上手uniapp框架的学习
vue环境搭建以及配置（脚手架搭建）
-
首先要明确三样东西
- npm：node.js的包管理器
- webpack：主要用途是通过CommonJS 的语法把所有浏览器端需要发布的静态资源作相应的准备，比如资源的合并和打包。
- vue-cli：学习vue的过程会知道这是vue的脚手架，用于生成vue的功能模板。帮你快速开始一个vue的项目，也就是给你一套vue的结构，包含基础的依赖库，只需要npm install 就可以安装。
-
nodejs下载网址：https://nodejs.org/en/
-
下载好之后安装，一直下一步就可以，安装位置可以换到自己熟悉的位置
-
安装好后可以在文件夹中找到nmp.cmd。
-
然后在命令行界面查看是否安装成功
- 建立如图两个文件夹：模块文件夹待会会改变位置，不管
-
然后运行以下两条命令，目的是修改系统默认的缓存位置（系统默认在c盘的programfile里）
-
/***************一定要以管理员模式启动cmd界面！！！切记！！
-
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"
-
到这一步可以选择配置国内镜像以提高速度（有时候国内镜像会出问题，yysy，还是得梯*子）
-
找到C:\Users\Administrator.npmrc，查看内容，可以看到刚才修改的默认信息。
-
接下来还需要调整环境变量，进入修改界面，先修改系统变量：
- 添加变量 NODE_PATH，变量值如下图
- 添加变量 NODE_PATH，变量值如下图
-
修改用户变量“Path”
- path内会找到一个生成的node相关路径，修改成自定义的node_global如下图：
-
到这一步，配置就完成了，我们来测试一下。
-
测试可以用express模块，这是最常用的。
-
进行全局安装
-
npm install express -g # -g是全局安装的意思 -
/如果报错，说明你又没开管理员模式/
-
安装完express模块可以在之前设置的全局路径里找到，即node_global
-
如果你已经安装过express，它也会报错，就像这样
-
这时候，我们来安装vue.js
-
npm install vue -g //npm和-g的意思上面已经说过
- 可以在全局目录下找到安装好的vue，
-
我们在nodeglobal目录下找到了安装的vue（最开始提到的node_modules文件夹此时也出现在这里）
-
dist是distribution的缩写，为最终发布产品
-
查看vue版本时的命令行为：
-
vue -V //特别的，查看vue版本时的-V为大写 -
然后安装vue脚手架的init模块：
-
切换为d盘，且为根目录
-
npm i -g @vue/cli-init
-
进行vue项目初始化
-
vue init webpack vue1 //vue1为创建的文件夹名称
-
前三个部分可以自己命名填写，不建议大写，之后就会开始自动建立项目
-
初始化：
成功！打开提示地址就可以看到vue界面
- 然后就可以用webstorm打开vue1查看自己的代码（图转）
初始化uniapp项目：
-
npm install -g @vue/cli -
要create一个uniapp项目，cli版本必须至少为3.0，不然执行下一步会报错（当然报错的时候它会告诉你版本太旧了，让你uninstall再install，就像这样）
-
vue create -p dcloudio/uni-preset-vue my-project //my-project为项目名
-
此时会提示选择项目模板：
创建完就可以用webstorm打开了
- CLI 工程默认带了 uni-app 语法提示和 5+App 语法提示
-
运行项目
-
npm run dev:%PLATFORM%
-
Hbuilder配置uniapp项目
-
首先，配置你之前安装好的node.js路径和npm路径