Vue-cli创建项目从单页面到多页面3-关于将打包后的项目文件不放在根目录下
关于将打包后的项目文件不放在根目录下
有时候,我们总是需要这样的设置:希望将打包后的文件放在a.b.com/somepath/这样一个路径下。
然而在vue-cli创建的项目中,默认的打包路径中的静态资源的访问路径是:a.b.com/a.js,我们希望在html中的引用是a.b.com/somepath/a.js,我们可以在config/index.js中进行如下设置:
module.exports= {
build: {
assetsSubDirectory: '/somepath/' // 用于设置静态资源的引用前缀,相当于设置一个base路径的作用,会将在页面中引用的静态资源,在域名和static(如果你将js、css、img等静态资源打包到这个文件夹下的话)之间,加上你设置的值
}
}
而我们在本地开发时,如果希望本地访问的路径也加上/somepath/,就可以在config/index.js中进行与build一样的设置:
module.exports= {
dev: {
assetsSubDirectory: '/somepath/' // 用于设置静态资源的引用前缀,相当于设置一个base路径的作用,会将在页面中引用的静态资源,在域名和static(如果你将js、css、img等静态资源打包到这个文件夹下的话)之间,加上你设置的值
}
}
我的vue多页面系列的其他博客链接:
Vue-cli创建项目从单页面到多页面2-history模式
Vue-cli创建项目从单页面到多页面4 - 本地开发服务器设置代理
Vue-cli创建项目从单页面到多页面3-关于将打包后的项目文件不放在根目录下的更多相关文章
- 解决@vue/cli 创建项目是安装chromedriver时失败的问题
最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...
- Vue CLI 创建项目
使用命令创建VUE项目 运行以下命令[vue create [项目名]]来创建一个新项目: vue create hello-world 警告 如果你在 Windows 上通过 minTTY 使用 G ...
- vue/cli创建项目过程
①vue create demo vue版本:3.9.3,node版本:12.8.0 ②Manually select features ③Bab ...
- Vue-cli创建项目从单页面到多页面
vue-cli创建项目从单页面到多页面 对于某些项目来说,单页面不能很好的满足需求,所以需要将vue-cli创建的单页面项目改为多页面项目. 需要修改以下几个文件: 1.下载依赖glob $npm i ...
- Vue-cli创建项目从单页面到多页面2-history模式
之前讲过怎样将vue-cli创建的项目改造成多页面(vue-cli创建项目从单页面到多页面),今天说一下怎样在多页面的前提下使用history模式. 如何使用history模式 因为vue默认的has ...
- Vue-cli创建项目从单页面到多页面4 - 本地开发服务器设置代理
前后端分离开发时,有时候会遇到跨域的情况:只在开发的时候存在跨域,项目上线后,由于配置的域名相同,跨域就会不存在. 这个时候,有两种方案可以比较快的解决: 1.利用h5的特性,使用cors,在ngni ...
- vue cli创建typescript项目
使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...
- vue-cli@3.x之使用vue ui创建项目-来自一个战五渣的体验
1. 全局安装vue-cli yarn global add @vue/cli // 检查安装是否成功 vue -V // 3.2.2 2. 初始化 vue ui 执行命令 vue ui 2.1 该命 ...
- 初学Vue.js,用 vue ui 创建项目会不会被鄙视
全栈的自我修养: 6使用vue ui进行vue.js环境搭建 It is only with the heart that one can see rightly. What is essential ...
随机推荐
- vi 替换操作
举例一: ,$s/// 从第一行到最后一行 147都替换为150 举例二: 例:替换当前文件中所有old为new :%s/old/new/g #%表示替换说有行,g表示替换一行中所有匹配点. 举例三: ...
- xml格式发送
1. namespace xml格式发送 { /// <summary> /// 实体转Xml,Xml转实体类 /// </summary> /// <typeparam ...
- GridControl 二次封装,自定义颜色样式风格
1.自定义颜色格式,分组,筛选 1.封装类 必须引用类库 using System; using System.Collections.Generic; using System.Linq; usin ...
- GitHub for window 使用教程
Git是目前最先进的分布式版本控制系统,作为一个程序员,我们需要掌握其用法. 一:下载GitHub for Windows 二:安装GitHub 下载之后点击进行安装过程,安装之后桌面上会有两个 ...
- springBoot+springCloud学习笔记
尊重原创:https://www.jianshu.com/p/492dfefa2735 SpringBoot 配置优先级 在命令行中传入的参数 如:java -jar storeMs.jar --se ...
- PHP 依据IP地址获取所在城市
有这种需求,须要依据用户的IP地址,定位用户所在的城市. 本文记录性文章,无逻辑性.有这样需求的朋友.能够直接拷贝使用.直接上代码,不需赘述. <? php header('Content-Ty ...
- 大师养成计划之一:搭建springmvc框架
搭建spring-mvc框架 搭建spring-mvc框架步骤: 1.搭建web项目spring-mvc1 2.引入jar包 3.配置web.xml 3.1拷贝头文件: <web-app xml ...
- 《HBase in Action》 第三章节的学习总结 ---- 如何编写和运行基于HBase的MapReduce程序
HBase之所以与Hadoop是最好的伙伴,我理解就因为两点:1.HADOOP的HDFS,为HBase提供了分布式的存储方式:2.HADOOP的MR为HBase提供的分布式的计算方法.u 其中第一点, ...
- vue面试题,知识点汇总(有答案)
一. Vue核心小知识点 1.vue中 key 值的作用 key 的特殊属性主要用在 Vue的虚拟DOM算法,在新旧nodes对比时辨识VNodes.如果不使用key,Vue会使用一种最大限度减少动态 ...
- 公告板shader
Shader "Custom/LightPoint" { Properties { _MainTex ("Main Tex", 2D) = "whit ...