mpvue小程序--我的成长之路--搭建

mpvue 是美团开源的一套语法与vue.js一致的、快速开发小程序的前端框架,按官网说可以达到小程序与H5界面使用一套代码。使用此框架,开发者将得到完整的 Vue.js 开发体验,同时为 H5 和小程序提供了代码复用的能力。如果想将 H5 项目改造为小程序,或开发小程序后希望将其转换为 H5,mpvue 将是十分契合的一种解决方案。

Mpvue官网:http://mpvue.com/


使用Vue开发微信小程序:mpvue框架。端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,下载https://nodejs.org/en/,安装完成之后,打开cmd开始输入命令。


步骤1. 检查下 Node.js 是否安装成功

node -v   

步骤2:检查npm版本

npm -v

步骤3: 安装淘宝镜像

npm set registry https://registry.npm.taobao.org/

步骤4: 全局安装 vue-cli

npm install --globalvue-cli

步骤5:创建一个基于 mpvue-quickstart 模板的新项目

vue init mpvue/mpvue-quickstart my-project

——————————————————————————————

我在这个位置报了一个错。

'无法将“vue”项识别为 cmdlet、函数、脚本文件或可运行程序的名称' 或 'vue不是内部或外部命令'

原因是我之前安装过vue-cli

解决方案:

全局搜索 vue.cmd--复制地址

电脑--属性--高级系统设计---环镜变量--path--编辑--新建  --粘入复制地址

原文:https://blog.csdn.net/weixin_43392673/article/details/84637013

————————————————————————————————

步骤6:安装my-project项目所需要的依赖

cd my-project

npm install

步骤7:运行

npm run dev




代表运行成功,可以看到本地多了个 dist 目录,这个目录里就是生成的小程序相关代码。

Vue开发环境已经搭建好,接下来打开微信开发者工具,,调试开发我们的框架 mpvue,依次填写需要的信息,微信开发者工具环境搭建详见教程:https://www.jianshu.com/p/0ff8c3b2f59f



你可能感兴趣的:(mpvue小程序--我的成长之路--搭建)