mpvue是一个使用 Vue.js 开发小程序的前端框架

http://mpvue.com/

sass的使用

https://segmentfault.com/q/1010000014194954

npm i sass-loader -D / npm i node-sass -D
<style lang="scss">
.container{
padding: 0 30rpx;
}
</style>

1.初始化一个mpvue项目

# 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

每次都要先运行 npm run dev

2.目录

dist里的内容为生成的小程序代码,

src里为vue代码,且生成的对应小程序代码id是固定的,如果不能生成,可修改src里的vue页面名称。

3.mpvue获取微信登录信息

https://blog.csdn.net/weixin_36934930/article/details/80706820

vue制作小程序--mpvue的更多相关文章

  1. vue制作小程序--server

    服务端代码,开发者工具有提供 指南 https//cloud.tencent.com/document/product/619/11442 参考文档API https://developers.wei ...

  2. 微信小程序mpvue项目使用WuxWeapp前端UI组件

    前言:这是一篇简单粗暴的使用指南 在最近的小程序项目里前端UI框架最后选择使用WuxWeapp,这篇文章记录一下如何在小程序mpvue项目中使用该UI组件. 步骤一:下载源码 (地址在这里)主要是里面 ...

  3. 微信小程序&mpvue问题总结(1)

    微信小程序进入到首页的时候,日志打印出"created", "onlaunch", "mounted",具体代码如下:那么,在小程序中 cr ...

  4. 微信小程序 mpvue vant

    Mpvue中使用Vant Weapp组件库 https://segmentfault.com/a/1190000016228410?utm_source=tag-newest 小程序采坑记 mpvue ...

  5. 小程序mpvue怎么点击按钮获取button里面的值

    在小程序里面是没有dom元素的,这个我们只要会小程序的应该都知道,但是在平时开发中我们偶尔会遇到需要点击某个元素获取它的值的情况,在这里给大家列举了两种情况解决方法 方式一:数据绑定 这种情况的话,对 ...

  6. vue和小程序的相似之处

    小程序参考vue语法,之前做过小程序的,可以逆向思维.1,Vue文件后缀是.vue,vue组件把html<template>.js<script>和css<style&g ...

  7. 小程序mpvue中flyio的使用方法

    Fly.js 一个基于Promise的.强大的.支持多种JavaScript运行时的http请求库. 有了它,您可以使用一份http请求代码在浏览器.微信小程序.Weex.Node.React Nat ...

  8. 小程序mpvue中动态切换echarts图表

    如果你用mpvue,而且还想用echarts,那么这个包你可以以来一下 https://github.com/F-loat/mpvue-echarts 考虑到多个页面都休要用,所以抽出来作为一个组件, ...

  9. 小程序 mpvue自定义底部导航栏

    1.在compontents新建文件放入 <template> <section class="tabBar-wrap"> <article clas ...

随机推荐

  1. Robotframework-Appium 之常用API(二)

    续接上一文,更多API详细如下: 注:更多官方详情信息见 http://robotframework.org/robotframework/ 28. Name: Install App Source: ...

  2. setTimeout问题

    function fn(argu1){ alert(argu1); } setTimeout(fn, 1000, 12); setTimeout从第三个参数开始,之后的参数都是fn的.fn不用加(), ...

  3. Elasticsearch 健康状态处理

    笔者在自己的 ubuntu 服务器上使用 GET /_cat/health?v 命令时,返回值如下所示 可以看到集群状态为 yellow,这是什么意思呢?原来在 es 的集群状态中,有三种情况,官网描 ...

  4. oracle 11g Enterprise Manager配置失败

    Enterprise Manager以下简称em,Database Configuration Assistant简称DBCA. 病症 监听程序未启动或数据库服务未注册到该监听程序.启动该监听程序并注 ...

  5. ClsoSee(v2) Alpha测试中!这是一个临时的帮助页面...

    Clso See 测试中,最新的更新信息会显示在这里,欢迎您随时关注新版本动态. 您可以单击这里让程序打开本地帮助文件(新说明.txt) 等程序完成后,会制作专门的帮助页面. 因为采用了键盘Hook技 ...

  6. C# 调用微信接口的代码

    调用微信接口前需要准备的内容. 1.微信公众平台的appid 2.微信公众平台的secret 3..获取tokenid 4.获取ticket 5.生成签名的随机串 6.生成签名的时间戳 7.生成签名 ...

  7. 解决win10不显示coreldraw x4/5/6菜单栏

    1.下载插件 https://pan.baidu.com/s/1nQ1kgUNSD7-9sjUbv5M6XA 复制链接下载插件 2.导入插件到工作区 3.设置工具栏显示 4.把工具栏拖动到菜单栏位置, ...

  8. JAVA 从头开始<六>

    一.静态代码块 静态代码块不需要创建对象才执行,比对象数据优先存在于内存中 二.静态函数 三.单例设计模式 1.饿汉单例模式 缺点:一声明就创建一个对象,没有使用的话就浪费了. 2.懒汉单例模式 1. ...

  9. Lucene.net 全文检索文件

    using Lucene.Net.Analysis; using Lucene.Net.Analysis.Tokenattributes; using Lucene.Net.Documents; us ...

  10. item style edit in sharepoint 2013

    标题头添加属性:(如果需要使用ddwrt)xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime&quo ...