开源项目精选: 用Vue.js开发微信小程序 | 您所在的位置:网站首页 › 微信小程序开源项目期末 › 开源项目精选: 用Vue.js开发微信小程序 |
简单介绍
一个使用 Vue.js 开发小程序的前端框架。框架基于 Vue.js 核心,mpvue 修改了 Vue.js 的 runtime 和 compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验。该框架有以下优点: 1.彻底的组件化开发能力:提高代码复用性 2.完整的 Vue.js 开发体验 3.方便的 Vuex 数据管理方案:方便构建复杂应用 4.快捷的 webpack 构建机制:自定义构建策略、开发阶段 hotReload 5.支持使用 npm 外部依赖 6.使用 Vue.js 命令行工具 vue-cli 快速初始化项目 7.H5 代码转换编译成小程序目标代码的能力 安装首先,你需要已经安装微信开发者工具,链接: https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 其次,你需要安装node.js: https://nodejs.org/ 然后你应该能愉快的开始玩耍了 1.切换源 npm set registry https://registry.npm.taobao.org/2. 全局安装vue-cli(vue 官方的一个命令行工具) npm install --global vue-cli3.创建新项目 vue init mpvue/mpvue-quickstart test4.进入文件夹,安装依赖 cd testnpm installnpm run dev成功的话,在test目录下应该能看见一个dist文件夹 当然,以上是快速搭建的方法,想要自行配置的同学请自行参考: http://mpvue.com/build/#_2 使用打开你的 然后进入 目录请选择之前提到的那个dist文件夹 AppID影响能否真机调试 确定后,便能进入如下界面: 然后轻松愉快的用自己的方式打开src下的代码进行更改就ok了 mpvue是一个不错的框架,不论你是想玩一玩(例如我)还是进行开发都是不错的选择,vue的学习也不难,预测该项目下周还会在周榜上(笑) 你可能会用到的工具:mpvue-loader 提供 webpack 版本的加载器:http://mpvue.com/build/mpvue-loader mpvue-webpack-target webpack 构建目标:http://mpvue.com/build/mpvue-webpack-target postcss-mpvue-wxss 样式代码转换预处理工具:http://mpvue.com/build/postcss-mpvue-wxss px2rpx-loader 样式转化插件:http://mpvue.com/build/px2rpx-loader mpvue-quickstart mpvue-quickstart:http://mpvue.com/mpvue/quickstart mpvue-simple 辅助 mpvue 快速开发 Page / Component 级小程序页面的工具http://mpvue.com/mpvue/simple 关于webpack该项目还十分贴心的配了一张图: 和webpack的文档链接:https://doc.webpack-china.org/ 毕竟我也不了解,只能做到这了(笑) 作者背景简介美团点评,隶属于一家大型(国内顶尖)的外卖——美团外卖。 JavaScript mpvue Vue.js 前端 微信小程序 |
CopyRight 2018-2019 实验室设备网 版权所有 |