使用mpvue搭建一个初始小程序及项目配置方法


Posted in Javascript onDecember 03, 2018

 1. 初始化一个 mpvue 项目

现代前端开发框架和环境都是需要 Node.js 的,如果没有的话,请先下载 nodejs 并安装。

然后打开命令行工具:

# 1. 先检查下 Node.js 是否安装成功
$ node -v
v8.9.0

$ npm -v
5.6.0

# 2. 由于众所周知的原因,可以考虑切换源为 taobao 源
$ npm set registry https://registry.npm.taobao.org/

# 3. 全局安装 vue-cli
# 一般是要 sudo 权限的
$ npm install --global vue-cli@2.9

# 4. 创建一个基于 mpvue-quickstart 模板的新项目
# 新手一路回车选择默认就可以了
$ vue init mpvue/mpvue-quickstart my-project

# 5. 安装依赖,走你
$ cd my-project
$ npm install
$ npm run dev

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

2. 搭建小程序的开发环境

小程序自己有一个专门的微信开发者工具,最新版本下载地址。

这一步比较简单,按照提示一步步安装好就行,然后用微信扫描二维码登陆。 至此小程序的开发环境差不多完成。

3. 调试开发 mpvue

选择 小程序项目 并依次填好需要的信息:
•项目目录:就是刚刚创建的项目目录(非 dist 目录)
•AppID:没有的话可以点选体验“小程序”,只影响是否可以真机调试。
•项目名称。

如图:

使用mpvue搭建一个初始小程序及项目配置方法

小程序项目配置

点击“确定”按钮后会跳到正式的开发页面,点击“编辑器”按钮,关闭自带的小程序编辑器。然后如图:

使用mpvue搭建一个初始小程序及项目配置方法

此时,整个 mpvue 项目已经跑起来了。

用自己趁手的编辑器(或者IDE)打开 my-project 中的 src 目录下的代码试试。

总结

以上所述是小编给大家介绍的使用mpvue搭建一个初始小程序及项目配置方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
破除网页鼠标右键被禁用的绝招大全
Dec 27 Javascript
Jquery练习之表单验证实现代码
Dec 14 Javascript
nodeType属性返回被选节点的节点类型介绍
Nov 22 Javascript
js仿腾讯QQ的web登陆界面
Aug 19 Javascript
微信小程序 tabs选项卡效果的实现
Jan 05 Javascript
node.js与C语言 实现遍历文件夹下最大的文件,并输出路径,大小
Jan 20 Javascript
jQuery加载及解析XML文件的方法实例分析
Jan 22 Javascript
原生js实现验证码功能
Mar 16 Javascript
原生js编写2048小游戏
Mar 17 Javascript
详解vue 组件之间使用eventbus传值
Oct 25 Javascript
angular实现input输入监听的示例
Aug 31 Javascript
微信小程序实现单选功能
Oct 30 Javascript
JS基于Location实现访问Url、重定向及刷新页面的方法分析
Dec 03 #Javascript
koa2实现登录注册功能的示例代码
Dec 03 #Javascript
react-router 路由切换动画的实现示例
Dec 03 #Javascript
Vue.js 中的 v-model 指令及绑定表单元素的方法
Dec 03 #Javascript
ng-zorro-antd 入门初体验
Dec 03 #Javascript
如何使用 vue + d3 画一棵树
Dec 03 #Javascript
Vue.js中 v-model 指令的修饰符详解
Dec 03 #Javascript
You might like
php递归函数中使用return的注意事项
2014/01/17 PHP
php 利用socket发送HTTP请求(GET,POST)
2015/08/24 PHP
详解laravel安装使用Passport(Api认证)
2018/07/27 PHP
php中的依赖注入实例详解
2019/08/14 PHP
jQuery EasyUI API 中文文档 - ComboGrid 组合表格
2011/10/13 Javascript
在iframe里的页面编写js,实现在父窗口上创建动画效果展开和收缩的div(不变动iframe父窗口代码)
2011/12/20 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
2013/01/23 Javascript
js 得到文件后缀(通过正则实现)
2013/07/08 Javascript
JS+DIV实现鼠标划过切换层效果的实例代码
2013/11/26 Javascript
js与jQuery 获取父窗、子窗的iframe
2013/12/20 Javascript
js解析json读取List中的实体对象示例
2014/03/11 Javascript
原生js实现移动端瀑布流式代码示例
2015/12/18 Javascript
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
2016/01/19 Javascript
js实现图片缓慢放大缩小效果
2016/08/02 Javascript
jQuery实现获取table中鼠标click点击位置行号与列号的方法
2017/10/09 jQuery
vue+iview写个弹框的示例代码
2017/12/05 Javascript
解决Js先触发失去焦点事件再执行点击事件的问题
2018/08/30 Javascript
解决layer弹出层中表单不起作用的问题
2019/09/09 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
在vue中实现嵌套页面(iframe)
2020/07/30 Javascript
Vue.js暴露方法给WebView的使用操作
2020/09/07 Javascript
Python中max函数用于二维列表的实例
2018/04/03 Python
浅谈django rest jwt vue 跨域问题
2018/10/26 Python
PyQt5实现简单数据标注工具
2019/03/18 Python
python利用JMeter测试Tornado的多线程
2020/01/12 Python
伊芙丽官方旗舰店:中国淑女一线品牌
2017/12/01 全球购物
加拿大品牌鞋包连锁店:Little Burgundy
2021/02/28 全球购物
股权转让协议书范本
2014/04/12 职场文书
学习型班组申报材料
2014/05/31 职场文书
建筑工程技术专业求职信
2014/07/16 职场文书
讲文明懂礼貌演讲稿
2014/09/11 职场文书
2014年帮扶工作总结
2014/11/26 职场文书
父亲节感言
2015/08/03 职场文书
2016年小学生寒假家长评语
2015/10/10 职场文书
Python编程编写完善的命令行工具
2021/09/15 Python
PHP正则表达式之RCEService回溯
2022/04/11 PHP