条件:mpvue小顺序运用fly作为http要求
转换后的目次构造以下:
├─build
├─config
├─src
│ ├─components
│ ├─pages
│ ├─store
│ ├─router
│ ├─App.vue
│ └─main.js
├─static
├─.babelrc
├─.editorconfig
├─.eslintignore
├─.eslintrc.js
├─.gitignore
├─.postcssrc.js
├─index.html
├─package.json
└─README.md
修正设置文件
用vue-cli脚手架初始化一个项目
vue init webpack my-project
- 将mpvue小顺序中src文件夹和static文件夹拷贝到my-project中,掩盖my-project本来的文件夹
修正main.js文件
删除关于小顺序相干设置
// 小顺序中运用 var Fly=require("flyio/dist/npm/wx") // web中运用 var Fly=require("flyio/dist/npm/fly") // 指定挂载元素 new Vue({ el: '#app', template: '<App/>', components: { App } })
修正APP.vue
删除关于小顺序的相干设置,增加以下代码
<template> <div id="app"> <router-view></router-view> </div> </template>
设置路由
设置相干路由
import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const getPage = name => { return resolve => require([`../pages/${name}/index.vue`], resolve) } export default new Router({ routes: [ { path: '/', name: 'index', component: getPage('index') } ] })
修正main.js
将路由挂载到根组件
import router from './router' new Vue({ el: '#app', router, template: '<App/>', components: { App } })
装置依靠
cnpm install
列表项目
cnpm run dev
运转中应该会涌现一些毛病,会提醒装置flyio,装置就是
处理一些毛病,不出之外就能够跑起来了