做VUE项目时,有时想做多个入口来解决某些问题。

在根目录下的复制一份index.html,名称随便你命名,当然,你也可以都是放到一个文件夹下,我的就叫index1.html

然后在App.vue也复制一份,我的也叫App1.vue

然后main.js也复制一分,我的还 是命名main1.js

在main1里面更改下,把

import App from "./App";

改为

import App from "./App1";

其它 可以不用变。

然后到build文件夹里面。

webpack.base.conf.js文件在entry添加一个入口,如图

webpack.dev.conf.js文件的plugins里面也添加一段代码,如何红框

再在webpack.prod.conf.js文件plugins里面也添加 一份代码 ,如何红框所示

最后 在config文件夹里面的index.js在build里面添加一个请求,如图所示

至此。。多个入口配置已经完成 。

npm run build后会生成两个 入口文件,index.html和index1.html。

在浏览器上,可以用两个地址访问,比如我的是

http://localhost:8080/#/是默认地址,

也可以是http://localhost:8080/index1.html#/

vue设置多个入口的更多相关文章

  1. vue设置title和ioc图标

    vue设置ioc图标和title 1.ioc图标设置 在根目录中的index.html中引入代码: <link rel="shortcut icon" type=" ...

  2. 第44篇-为native方法设置解释执行入口

    对于Java中的native方法来说,实际上调用的是C/C++实现的本地函数,由于可能会在Java解释执行过程中调用native方法,或在本地函数的实现过程中调用Java方法,所以当两者相互调用时,必 ...

  3. vue设置多入口教程

    官方脚手架搭建vue项目 在src 目录下复制app内容创建test.vue,demo.vue, main.js复制main.js内容demo.js,test.js,修改一下内容 在根目录下创建tes ...

  4. Vue设置全局的方法和样式

    vue中我么会经常用到通用的一些全局的方法,如何左才能实现全局的复用减少代码累赘呢? 我们一般将公用的方法分装再utils.js文件中,然后再main.js主入口文件中将utils.js中的公共的方法 ...

  5. vue 设置头文件

    vue的头文件是在index.html文件中设置的,毕竟vue的入口 先说一下标签页的名字: 就是这个名字的设置,要想每个标签页的名字都不一样,需要做以下这三步:1. 首先,在index.html文件 ...

  6. Vue设置element的dialog

    1.设置css:参考https://www.jianshu.com/p/a3eb60b75b92 <style> .el-dialog { max-height: 600px; displ ...

  7. vue设置路由跳转参数,以及接收参数

    最近做Vue项目,遇到了一个路由跳转问题:首页要跳转到项目页指定的Tab选项卡项,一开始总是跳到默认项.解决方法如下: 在跳转链接处设置了路由跳转参数,如下: <router-link  :to ...

  8. Vue设置页面的title

    原文地址:http://www.cnblogs.com/JimmyBright/p/7410771.html 前端框架如Vue.React等都是单页面的应用,也就是说整个web站点其实都是一个inde ...

  9. vue设置页面标题

    使用vue-wechat-title插件对页面标题进行设置 1.安装模块    命令行窗口中运行npm install vue-wechat-title --save PS.如果程序正在运行,ctrl ...

随机推荐

  1. C++ 已知两个时间(年月日)求日期差

    转载:https://blog.csdn.net/flyyufenfei/article/details/79796035 #include<iostream> #include < ...

  2. 【SpringBoot】SpringBoot与Thymeleaf模版(六)

    ---恢复内容开始--- 模板引擎的思想 模板是为了将显示与数据分离,模板技术多种多样,但其本质都是将模板文件和数据通过模板引擎生成最终的HTML代码. Thymeleaf介绍 Thymeleaf是适 ...

  3. 【PHP】两个时间段间隔30分钟的所有时间

    运用场景: 比如在进行配送时候,需要让用户选择 送达时间, 平台只需要设置每天的营业时间.比如:08:00 到  22:30. 前台在展示时候: 就需要处理成各个时间段来展示: 代码实现: <? ...

  4. Elasticsearch6.2.1安装elasticsearch-sq插件

    参考 https://github.com/NLPchina/elasticsearch-sql 1.下载插件 wget https://github.com/NLPchina/elasticsear ...

  5. ODAC Developer Downloads - Oracle Universal Installer

    https://www.baidu.com/link?url=BL2vRNMWap6AFJcmsFCEKi3KxZ2SgmtVJoihVKhF-SPgzvJHNkbk_j7nz1HdtAAWZ22NM ...

  6. TCP/IP和OSI4层、7层协议介绍

    1.TCP/IP全称:Transmission Control Protocol / Internet Protocol 中文翻译:传输控制协议 / 互联网协议 2.OSI4层.7层模型:

  7. Centos7——Firefox浏览器个性化配置调教

    因为谷歌浏览器无法正常登陆帐号,只能切换到火狐浏览器 默认浏览器我使用的是bing搜索 1.隐藏顶部标题栏 顶部标题栏真的占地方,所以直接选择隐藏 点击设置->自定义customize-> ...

  8. 领域模型/DDD领域驱动设计

    http://www.fanyilun.me/2018/04/08/%E8%B0%88%E8%B0%88%E9%A2%86%E5%9F%9F%E5%BB%BA%E6%A8%A1/ http://www ...

  9. javascript中的this绑定问题

    this的绑定规则 1 默认绑定: function foo(){ console.log(this.a); } var a = 2 ; foo(); 调用 foo() 的时候其实相当于 window ...

  10. Visual Studio Code工具使用及配置

    最近迷上了这个工具,启动速度快,好多插件.唯一不满意的地方就是svn版本控制工具.下面发现我装的一些插件及配置: 我安装的一些插件: 上面是我装的插件,等有时间再解释下插件的作用. 接下来说下配置: ...