vue-cli配置多入口多出口,实现一个项目两个访问地址,区分不同上线环境
最近工作中需要把项目分割成两块,一块需要跑在微信中,通过微信jdk获取用户资料默认登录,一部分需要给原生app做webview的内嵌页面,当然这部分内容是不跑在微信中的。
所以我想到了把项目分成两部分,不同的入口来控制是否获取微信的个人信息,比如原入口main.js中调用微信接口,获取用户信息,并携带用户信息的token标识。
而从inlay.js进入的则不调用微信接口,不获取用户信息。
并且npm run build后打包完后dist目录下出现两个入口: index.html 和 inlay.html 分别对应 main.js 和 inlay.js
在查阅了一些资料后对vue-cli生成的webpack进行了如下修改:
1.修改项目文件结构:

2. 修改 build/webpack.base.conf.js

3. 修改 build/webpack.dev.conf.js

4.修改 build/webpack.prod.conf.js

5. 修改 config/index.js

文件流大概是这样的:
main.js ==> entry/App.vue
inlay.js ==> entry/inlay.vue
当然也可以通过路由控制走一个router-view, 总之,进了不同的入口就可以通过不同的入口进行控制,也可以通过不同的路由,不同的axios配置进行控制,并且打包出来有不同的出口,也就是部署以后有两个url:
www.xxx.com 和 www.xxx.com/inaly.html
可以到我github上查看demo的源码: https://github.com/Jasonwang911/numtller
vue-cli配置多入口多出口,实现一个项目两个访问地址,区分不同上线环境的更多相关文章
- vue 快速入门 系列 —— 使用 vue-cli 3 搭建一个项目(上)
其他章节请看: vue 快速入门 系列 使用 vue-cli 3 搭建一个项目(上) 前面我们已经学习了一个成熟的脚手架(vue-cli),笔者希望通过这个脚手架快速搭建系统(或项目).而展开搭建最好 ...
- vue 快速入门 系列 —— 使用 vue-cli 3 搭建一个项目(下)
其他章节请看: vue 快速入门 系列 使用 vue-cli 3 搭建一个项目(下) 上篇 我们已经成功引入 element-ui.axios.mock.iconfont.nprogress,本篇继续 ...
- vue项目配置多入口多出口【转载】
版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/localhost_1314/article ...
- vue cli 配置信息说明
摘自csdn http://blog.csdn.net/hongchh/article/details/55113751
- (3/24)轻松配置 webpack3.x入口、出口配置项
在上一节中我们只是简单的尝了一下webpack的鲜,对其有了基本的了解,对于上一节当中的打包方式,在实际开发中并不使用,而是通过webpack的配置文件的方式进行设置的,所以该节就在上一节的基础上学一 ...
- vue cli 3
介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快 ...
- Vue CLI 是如何实现的 -- 终端命令行工具篇
Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供了终端命令行工具.零配置脚手架.插件体系.图形化管理界面等.本文暂且只分析项目初始化部分,也就是终端命令行工具的实现. 0. 用法 ...
- vue中配置sass(包含vue-cli 3)
目录 vue vue cli 3 老版本的脚手架搭建的项目 版本 安装 不用修改任何配置 vue文件中使用 vue 更新时间: 2018-09-21 vue cli 3 选择 Manually sel ...
- vue的配置环境篇
1.电脑已经安装的nodejs和webpack. 2.1)打开cmd.win+r.可以直接输入node -v查看版本.安装淘宝镜像 npm install -g cnpm --registry=ht ...
随机推荐
- 简单的线程Thread使用
static void Main(string[] args) { for (int i = 0; i < 5; i++) { aa a = new aa(); a.age = i; Threa ...
- beautiful number 数位dp
题意: 求高位往低位递减且 高位%低位==0(相邻) 数字数量 唯一要注意的就是前导零!!!!!!(正因为这个前导零 一开始的pre设置为0 ) 比如 11 10 09 08 ...
- Hive的配置| 架构原理
Hive是基于Hadoop的一个数据仓库工具,可以将结构化的数据文件映射为一张表,并提供类SQL查询功能. 本质是:将HQL转化成MapReduce程序 1)Hive处理的数据存储在HDFS 2)Hi ...
- 非对称加密算法-RSA算法
一.概述 1.RSA是基于大数因子分解难题.目前各种主流计算机语言都支持RSA算法的实现 2.java6支持RSA算法 3.RSA算法可以用于数据加密和数字签名 4.RSA算法相对于DES/AES等对 ...
- Python之IO编程——文件读写、StringIO/BytesIO、操作文件和目录、序列化
IO编程 IO在计算机中指Input/Output,也就是输入和输出.由于程序和运行时数据是在内存中驻留,由CPU这个超快的计算核心来执行,涉及到数据交换的地方,通常是磁盘.网络等,就需要IO接口.从 ...
- BroadcastReceiver插件化解决方案
--摘自<android插件化开发指南> 1.静态广播和动态广播仅区别于注册方式的不同.静态广播的注册信息保存在PMS中,动态广播的注册信息保存在AMS中 2.发送广播,也就是Contex ...
- MongDB-基础
首先吐槽一下,MongDB用到了JS的引擎,只要涉及到了JS,语法就变得又臭又长,真是无语 还有,MongDB的安装真是麻烦,我用的是win10环境,怎么装都报服务错误,redis一装就可以用,希望m ...
- Codeforces 1093D. Beautiful Graph【二分图染色】+【组合数】
<题目链接> 题目大意: 给你一个无向图(该无向图无自环,且无重边),现在要你给这个无向图的点加权,所加权值可以是1,2,3.给这些点加权之后,要使得任意边的两个端点权值之和为奇数,问总共 ...
- HDU 3415 Max Sum of Max-K-sub-sequence【单调队列】
<题目链接> 题目大意: 给你一段从1~N的圆形序列,要你求出这段圆形序列中长度不超过K的最大连续子序列之和是多少,并且输出这子序列的起点和终点. 解题分析: 既然是求连续子序列之和,我们 ...
- Spring ConfigurationClassPostProcessor Bean解析及自注册过程
一.Bean的自注册过程 二.自注册过程说明 ConfigurationClassParser解析流程 1.处理@PropertySources注解,配置信息的解析 2.处理@ComponentSc ...