mpvue小程序转H5

raledong 发布于2019-08-22 18:32 / 899人阅读

摘要：前提小程序使用作为请求转换后的目录结构如下修改配置文件用脚手架初始化一个项目将小程序中文件夹和文件夹拷贝到中，覆盖原来的文件夹修改文件删除关于小程序相关配置小程序中使用中使用指定挂载元素修改删除关于小程序的相关配置，添加如下代码

前提：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: "",
      components: { App }
    })

修改APP.vue

   删除关于小程序的相关配置，添加如下代码

配置路由

配置相关路由

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: "",
  components: { App }
})

安装依赖

    cnpm install

列表项目

    cnpm run dev
    运行中应该会出现一些错误，会提示安装flyio,安装便是
    解决一些错误，不出以外就可以跑起来了

海外云主机服务器托管个人小程序转企业小程序微信内h5页面打开小程序 js网站转小程序 mpvue

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/95970.html

mpvue开发小程序所遇问题及h5转化方案

摘要：腾讯地图提供的只提供了经纬度定位，而产品需要的是确认定位后获取城市，进行同城商品检索阿里云对象储存处理文件上传，比较意外的是腾讯对阿里云的域名前缀进行了封禁后台不能配置，解决方案是让后台将该域名进行服务器域名代理。 mpvue开发小程序所遇问题及h5转化方案项目结构 |---build |---pages.js文件目录 |---src ...

big_cat 2019-08-22 18:06 评论0 收藏0
【开源】小程序And公众号商城，外加后台，功能齐全！

摘要：前言一个集微信公众号商城小程序商城商城后台的一个开源项目，后台是基于开发的，是一个简洁而强大的开源微信公众平台开发框架，微信功能插件化开发多公众号管理配置简单。微信小程序项目下载整个包之后，进行根目录文件夹。前言一个集微信公众号商城/小程序商城/商城后台的一个开源项目，后台是基于WeiPHP5.0开发的，WeiPHP是一个简洁而强大的开源微信公众平台开发框架，微信功能插件化开发,多...

VishKozus 2019-08-23 13:49 评论0 收藏0
【开源】小程序And公众号商城，外加后台，功能齐全！

摘要：前言一个集微信公众号商城小程序商城商城后台的一个开源项目，后台是基于开发的，是一个简洁而强大的开源微信公众平台开发框架，微信功能插件化开发多公众号管理配置简单。微信小程序项目下载整个包之后，进行根目录文件夹。前言一个集微信公众号商城/小程序商城/商城后台的一个开源项目，后台是基于WeiPHP5.0开发的，WeiPHP是一个简洁而强大的开源微信公众平台开发框架，微信功能插件化开发,多...

linkFly 2019-07-01 11:00 评论0 收藏0
美团小程序框架mpvue蹲坑指南

摘要：这个是我们约定的额外的配置这个字段下的数据会被填充到顶部栏的统一配置美团汽车票同时，这个时候，我们会根据的页面数据，自动填充到中的字段。美团小程序框架mpvue(花名：没朋友)蹲坑指南第一次接触小程序大概是17年初,当时小程序刚刚内侧,当时就被各种限制折腾的死去活来的,单向绑定,没有promise,请求数限制,包大小限制,各种反人类,...反正我是感受到了满满的恶意.最近接到一个工...

AprilJ 2019-08-22 16:01 评论0 收藏0