zoukankan      html  css  js  c++  java
  • mpvue 试水的一天

    小程序经过了将近两年的锤炼,现在出现了许许多多的框架,来帮助我们进行快速开发,最近可能迷上了mpvue这个框架,所以就用公司的项目练练手。

    mpvue是用vue作为基础骨架的,所以他非常想vue,所以说只要vue会,那么mpvue就会得心顺手了。

    废话不多说!直接上手。

    通过 Vue.js 命令行工具 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

    这样我们就构建好了一个小程序
    接着我们打开微信开发者工具,将项目导入,填上appid,这样我们就可以看到一个mpvue搭建的小程序呈现在眼前了(由于本人比较懒,截图就算了)
    我们也可以使用vant UI框架进行页面辅助构建页面,只不过本人觉得要是想与设计稿一致的话,还是老老实实的写代码吧,别想其他没用的了。

    当然,用mpvue写新的页面,不同像原生小程序一样在app.json写路径就会生成一个页面,在mpvue中,我们需要在src文件夹中的pages文件夹中新建文件夹如mine(我的),然后在这个文件夹里新建三个文件index.vue main.js main.json ,然后在
    src文件夹中的app.json中的pages数组中添加pages/mine/main,这样就成功新建了一个页面,然后重启服务npm run dev(必须重启,否则新建失败,因为小程序处理的是他编译后的dist文件夹里的内容);而我常用的做法就是,复制其他页面文件夹,修改名字,在pages数组中添加路径,重启,这样
    比较快点



  • 相关阅读:
    Android_存储访问框架SAF
    Android_基础之分辨率
    Android_存储之SharedPreferences
    Android_存储之DataBase之Room
    Android_AndroidX简介&Junit4
    Android_四大组件之ContentProvider
    Android_四大组件之BroadcastReceiver
    Android_四大组件之Service
    Android启动过程_大致流程
    福利来袭,赶紧上车!
  • 原文地址:https://www.cnblogs.com/WangXinPeng/p/10141293.html
Copyright © 2011-2022 走看看