美文网首页程序员
mpvue系列(一):构建新项目

mpvue系列(一):构建新项目

作者: 醉虾不醉 | 来源:发表于2018-06-13 14:02 被阅读13次

mpvue怎么创建新项目?

1、安装node环境。

2、全局安装vue-cli。

3、创建新项目文件夹。

4.安装依赖。

5.运行。

1、安装node环境。

1.1、打开命令提示符?

(1)window+R

(2).输入cmd

1.2、window系统没有的话怎么安装?

(1)下载.msi文件x32位(看电脑多少位,官网下载对应的,以x32为例)

(2)直接双击安装

(3)重启cmd

(4).node -v查看

1.3、cnpm怎么安装?

(1)安装cnpm -->npm i -g cnpm --registry=https://registry.npm.taobao.org

1.4、cnpm报错?

(1)npm set registry https://registry.npm.taobao.org(注册模块镜像)

(2)npm set disturl https://npm.taobao.org/dist node-gyp(编译依赖的 node 源码镜像)

(3)npm cache clean --force( 清空缓存)

(4)npm install -g cnpm --registry=https://registry.npm.taobao.org

2、全局安装vue-cli。

(1)npm install --g vue-cli  全局安装

(2)vue -V  检查

3、创建新项目文件夹。

(1).vue init mpvue/mpvue-quickstart test-wxapp  (test-wxapp 是自定义的文件名)

4、安装依赖。

(1)进入项目 cd test-wxapp

(2)npm i 安装依赖

5、运行。

(1)npm run dev 运行程序

(2)打开开发者工具,项目目录填当前项目的dist文件夹。

5.1、开发者工具下载?

(1)登录微信公众平台

(2)首页-->开发工具-->点连接跳转下载

5.2、 怎么获取appID?

(1)微信公众平台-->设置-->开发设置

5.3、mpvue项目文档目录结构?

- node_modules  安装依赖包

- dist  您启动和打包应用程序时,Titanium为应用程序做准备的地方,(编译成小程序代码的地方)

- src  vue代码处

- main.js    项目配置文件,config字段就是小程序的全局配置

- index.html  挂载入口

- utils/index.js  工具函数

5.4、新项目下的文件整理?

(1)/src/pages 下面的counter和logs两个文件夹删掉

(2)/src/components 文件夹下面的文件也全删掉

(3)src/main.js 里面的 config.pages里面多余的路由也删掉,只保留一条['^pages/index/main']

(4)新增的页面需要重新 npm run dev 来进行编译


点赞的人都是最美的人!!

相关文章

  • mpvue系列(一):构建新项目

    mpvue怎么创建新项目? 1、安装node环境。2、全局安装vue-cli。3、创建新项目文件夹。4.安装依赖。...

  • mpvue 微信小程序没朋友轻松入门

    创建一个基于 mpvue-quickstart 模板的新项目 配置一系列项目参数,es检查建议选no $ vue ...

  • mpvue 微信小程序项目搭建

    搭建mpvue脚手架 第一步,基于mpvue-quickstart模板创建新项目 第二步,安装依赖和运行 第三步,...

  • mpvue系列(一)

    一、什么是mpvue? mpvue 是一个使用 Vue.js 开发小程序的前端框架。框架基于 Vue.js 核心,...

  • mpvue框架

    【最近更新】mpvue入门系列教程: 如何在mpvue中正确的引用小程序的原生自定义组件 使用mpvue开发小程序...

  • mpvue系列(二)

    封装mpvue请求文件 一、flyio是什么? flyio.js 是一个基于 promise 的,轻量且强大的Ja...

  • 构建mpvue小程序商城(一)

    mpvue官网介绍:mpvue(github 地址请参见)是一个使用Vue.js开发小程序的前端框架。框架基于Vu...

  • bitcoin mempool 杂记

    新构建的项目 新项目的构建文件:txmempool.go; txentry.go 已经完成的方法: mempool...

  • mpvue搭建小程序框架

    http://mpvue.com/mpvue/ 美团开源了mpvue 由于mpvue框架是完全基于Vue框架的(重...

  • mpvue 使用echarts---mpvue-echarts

    安装 mpvue-echarts地址mpvue-echarts $ cnpm install mpvue-echa...

网友评论

    本文标题:mpvue系列(一):构建新项目

    本文链接:https://www.haomeiwen.com/subject/kcsjeftx.html