手记

基于mpvue框架的小程序项目搭建入门教程一

1:安装node

端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,vue的运行是要依赖于node的npm的管理工具来实现,下载https://nodejs.org/en/,安装完成之后,打开cmd开始输入命令。(我用的是win10系统,所以需要管理员权限,右键点击以管理员身份运行cmd),不然会出现很多报错。

2:查看node的版本号

下载好node之后,以管理员身份打开cmd管理工具,,输入 node -v ,回车,查看node版本号,出现版本号则说明安装成功。

输入命令: node -v

3:安装淘宝npm镜像

进入D盘(当然可以根据你自己的选择来安装路径)全局安装镜像。由于npm是国外的,使用起来比较慢,我们这里使用淘宝的cnpm镜像来安装vue.
淘宝的cnpm命令管理工具可以代替默认的npm管理工具。

输入命令:npm install -g cnpm --registry=https://registry.npm.taobao.org

安装成功之后显示如下

4: 安装全局vue-cli脚手架

淘宝镜像安装成功之后,我们就可以全局vue-cli脚手架,输入命令:cnpm install --global vue-cli 回车;验证是否安装成功,在命令输入vue,出来vue的信息,及说明安装成功;

输入命令:cnpm install --global vue-cli
//vue3.0版本出来之后,也要在环境里面进行更新:
npm install -g @vue/cli-init

vue3.0版本出来之后,也要在环境里面进行更新:

输入,vue 查看是否安装完成

以上准备完成

5:创建第一个基于mpvue的小程序项目代码

1:创建项目的命令

vue init mpvue/mpvue-quickstart myproject

对于这些踢提示,新手的话可以一路回车键进行到底

打开d盘,就可以看到新建的项目了

这是命令创建的默认生成的项目目录结构

2:进入新建的项目目录里面,安装相关依赖,安装时间可能有些长,也可以cnpm install安装,然后运行

     cd myproject
     npm install
     npm run dev

####6:打开微信开发者工具


导入myproject项目

我们可以看见,一切准备就绪,这样所有的环境搭建好了,就可以进行下一步了。

写完之后我发现:原来已经写过一遍了,才会如此这般的顺利
基于mpvue的小程序项目搭建的步骤一:https://www.jianshu.com/p/692b2e49f33b

0人推荐
随时随地看视频
慕课网APP