您好!欢迎来到源码码网

微信小程序前端框架mpvue开发环境部署及搭建教程

  • 软件教程
  • 来源:源码码网
  • 编辑:admin
  • 时间:2020-08-08 18:33
  • 阅读:642

微信小程序前端框架mpvue开发环境部署及搭建教程,更多技术教程请点击软件教程查看;

mpvue介绍

    mpvue是基于vue开发小程序的前端框架,比如微信小程序,我们就可以用vue的语法做开发,因为mpvue该框架基于vue.js核心,修改了runtime和compiler的实现,使其可以运行在小程序环境中,这为学习前端开发的朋友们去上手开发小程序降低了门槛。

mpvue主要特性

1.彻底的组件化开发能力:提高代码复用性
2.完整的 Vue.js 开发体验
3.方便的 Vuex 数据管理方案:方便构建复杂应用
4.快捷的 webpack 构建机制:自定义构建策略、开发阶段 hotReload
5.支持使用 npm 外部依赖
6.使用 Vue.js 命令行工具 vue-cli 快速初始化项目
mpvue 环境搭建

1.安装node.js开发环境

2.全局安装vue-cli脚手架,然后基于模板初始化项目,安装依赖,构建

# 全局安装 vue-cli
$ npm install --global vue-cli

# 创建基于 mpvue-quickstart 模板的项目
$ vue init mpvue/mpvue-quickstart my-project

# 安装依赖
$ cd my-project

$ npm install
# 启动构建

$ npm run dev

3.打开微信小程序开发工具,导入my-project项目;基础环境就算完成了

注:微信web开发者工具wechat_devtools下载  ,百度搜索微信开发工具直接下载即可;

mpvue和其它小程序框架对比

对原生微信小程序、mpvue、WePY这三种开发小程序方式的比较 ,如下图

vue脚手架

总结

    通过mpvue环境搭建的简单讲解,感兴趣的朋友赶快参与尝试一下吧!相信大家一定会有所收获!!!


特别声明:
1、如无特殊说明,内容均为本站原创发布,转载请注明出处;
2、部分转载文章已注明出处,转载目的为学习和交流,如有侵犯,请联系客服删除;
3、编辑非《源码码网》的文章均由用户编辑发布,不代表本站立场,如涉及侵犯,请联系删除;
全部评论(0)
推荐阅读
  • css中rel的属性值都有哪些,分别代表什么意思
  • css中rel的属性值都有哪些,分别代表什么意思
  • 在HTML中,元素的rel属性用于定义当前文档与被链接文档之间的关系。这个属性在CSS的上下文中经常与样式表关联,但rel属性的用途远不止于此。以下是一些常见的rel属性值及其意义:1、stylesheet:表示被链接的文档是一个样式表。这通常用于链接CSS文件。
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-03-28 12:28
  • 阅读:201
  • css中的z-index是什么意思,如何使用?
  • css中的z-index是什么意思,如何使用?
  • z-index是CSS属性,用于控制元素在页面中的层叠顺序。z-index的值决定了元素在垂直层面上的显示顺序,具有较高z-index值的元素会覆盖具有较低z-index值的元素。默认情况下,元素的z-index值是auto,这意味着元素的层叠顺序由其在文档流中的位置决定。在没有使用定位属性的情况下,后面出现的元素会覆盖前面出现的元素。
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-03-28 11:34
  • 阅读:20
  • PHP开发五种数据打印方式举例说明
  • PHP开发五种数据打印方式举例说明
  • 在PHP中,有几种常用的打印方式,包括:1、echo:用于输出一个或多个字符串。它是PHP语句,不是函数,因此没有返回值。例如:echo ”Hello, World!”; // 输出 ”Hello, World!”2、print:用于输出一个字符串。它需要一个参数,并需要使用圆括号。print函数在输出后有返回值,如果执行失败则返回f
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-01-18 23:09
  • 阅读:316
  • php开发判断字符串是否相等的方法
  • php开发判断字符串是否相等的方法
  • 本文介绍php开发中常用的字符串比较的方法,以PHP7.4为例,可以使用双等号,strcmp()方法,strcasemp()方法、strncasecmp()方法以及ctrncmp()方法,等进行判断,下边以”==”和strcmp()方法为例进行举例:// 定义插入的数据$data = [    ”name” &
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-01-18 21:04
  • 阅读:238
  • thinkphp6 No input file specified解决办法
  • thinkphp6 No input file specified解决办法
  • thinkphp6出现Noinputfilespecified错误基本上都是因为访问路径出错引起的,解决办法也很简单,打开public目录下的的.htaccess文件,对伪静态规则进行编辑,将:把:RewriteRule ^(.*)$ index.php/$1 [QSA,PT,L]改为:RewriteRule ^(.*)$ index.php [L,E=PATH_I
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-01-17 20:24
  • 阅读:152
联系客服
源码代售 源码咨询 素材咨询 联系客服
029-84538663
手机版

扫一扫进手机版
返回顶部