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

网友投稿 434 2023-11-08

 1. 初始化一个 mpvue 项目

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

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

然后打开命令行工具：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# 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 项目已经跑起来了。

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

总结

以上所述是小编给大家介绍的使用mpvue搭建一个初始小程序及项目配置方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家

您可能感兴趣的文章:浅谈使用mpvue开发小程序需要注意和了解的知识点mpvue构建小程序的方法(步骤+地址)基于mpvue的小程序项目搭建的步骤微信小程序搭建(mpvue+mpvue-weui+fly.js)的详细步骤

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。

标签：配置 程序 方法 小程序
上一篇:广深启用微信医保支付，以后刷社保、查询记录有微信就够了
下一篇:小程序助实体店打造营销新时代
相关文章

 发表评论

暂时没有评论，来抢沙发吧~