vue打包项目访问路径设置

2024-08-31

Vue打包后访问静态资源路径问题

Vue介绍中static文件夹里放的是静态资源目录,如图片.字体等. 我们发现运行npm run start后本地图片路径是没问题的,但是打包上传后会怎么样呢? 我们知道,执行npm run build 后会生成dist文件夹,把里面的index.html在浏览器运行会发现图片路径出错啦!!! 解决方法: 1.先找到config下的index.js文件把最后的'/' 改为 './' 2.接着把图片地址改为这样就解决啦~~

vue打包静态资源路径不正确的解决办法

vue打包静态资源路径不正确的解决办法 vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对解决办法:打开config/index.js,将其中的assetsPublicPath值改为’./’ 2.css中引用的图片资源找不到我的login.vue文件中有一段css,其中引用了一个背景图片,是这样写的 .login{height:100%;background: url("../assets/login_bg.jpg") no-repeat

Vue背景图打包之后访问路径错误

问题背景:项目里面有用到背景图片,开发模式下正常,打包之后发现报404错误.查看发现是背景图片引用路径出错. 解决方法: .map { width: %; height: 397px; background: url(../../../static/backImgs/about5.png) no-repeat; background-size: % 397px; } build下由原来的相对路径 "./" 改为绝对路径 "/" 详细缘由: vue项目在打包之后

vue和webpack打包项目相对路径修改

一般vue使用webpack打包是整个工程的根目录,但是很多情况下都是把vue打包后的文件在某子目录下. 修改: 1,打开index.js assetsPublicPath:'/' 改为: assetsPublicPath: './' 2.解决css里面的路径问题,打开utils.js 添加红色框参数即可: publicPath: '../../'

web项目访问路径上为什么不能写上WebContent

我们常常在WEB项目中要写很多的访问路径,比如说/good/target.jsp;目录结构中从来不会带有项目目录结构的WebContent?这到底的为什么呢? 我们知道WEB项目是放在容器上运行的,而Java的源码是不不能直接运行,需要经过编译部署才能在容器上运行,那么线索就来了,容器上运行的是编译的结果,自然就不是项目本身(这里指的是项目本身的目录结构):所以所有的访问路径是按照编译后的路径.看下WEB工程的目录结构和编译结果的目录结构左边WEB项目的src的源码文件-->左边build下的

java 或者 js 获取项目访问路径（域名）

/** * 获得站点url * @return */ public String getWebUrl(){ String url = getRequest().getScheme() + "://" + getRequest().getServerName(); if(getRequest().getServerPort()!=80){ url+= ":" + getRequest().getServerPort(); } url+=getRequest().get

create-react-app 中设置反向代理、项目打包资源引入路径设置及 map 文件

1.配置反向代理 (1)porxy 配置一个代理修改package.json文件 "proxy":"http://teng.com/website/web", (2)proxy配置多个代理注意:若create-react-app 的版本在低于 2.0 的时候可以在 package.json 增加 proxy 配置即可, 配置成如下 "name": "wangguan", "version": "

Vue打包项目图片等静态资源的处理

项目打包,默认是打包在根目录下面的.当然我们可以通过设置,打包到任意子目录中去. 但是,当项目中引入资源的,比如:引入图片资源.js资源.或者字体图标之类的.那么可能在这个中间又会踩坑. 1.在vue文件引入图片例如,我们将一张图片放到资源目录 /static/image/lyf.jpg 我们在 vue 文件中用下面的代码来使用这张图片. <img src="static/image/lyf.jpg" alt=""> 注意,最前面不要加 / ,如果是这

ssh项目访问路径及url请求书写

在ssh项目中配置好Struts后,一般可以采用两种方式进行后台请求: 1.html形式,包括a标签,form表单,ajax等.此时的访问链接必须写全路径,可以是相对路径,也可以是绝对路径相对路径方式: namespace/actionname.action 此时默认地址是 http://localhost:8080/项目名/ 绝对路径方式: /项目名/namespace/actionname.action 此时默认地址是 http://localhost:8080 其中namesp

vue打包静态资源路径不正确的解决办法【转】

vue项目完成打包上线的时候很多人都会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对解决办法:打开config/index.js,将其中的assetsPublicPath值改为’./’ 2.css中引用的图片资源找不到我的login.vue文件中有一段css,其中引用了一个背景图片,是这样写的 .login{height:100%;background: url("../assets/login_bg.jpg") no-repeat; background-siz

vue打包项目后使用-webkit-line-clamp: 2;这个属性不生效？

在项目中要实现多行省略,-webkit-line-clamp: 2;打包后不生效,使用下面的方法: word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: ; overflow: hidden; 1.安装依赖这个依赖:npm i -S optimize-css-assets-webpack-plugin 2.并且注

相对路径和绝对路径的区别,java获取项目访问路径的方法

相对路径和绝对路径的区别在HTML里只要涉及文件的地方(如超级链接.图片等)就会涉及绝对路径与相对路径的概念. .绝对路径绝对路径是指文件在硬盘上真正存在的路径.例如“bg.jpg”这个图片是存放在硬盘的“E:\book\网页布局代码\第2章”目录下,那么 “bg.jpg”这个图片的绝对路径就是“E:\book\网页布\代码\第2章\bg.jpg".那么如果要使用绝对路径指定网页的背景图片就应该使用以下语句: <body backround="E:\book\网页布局\代码

Jenkins 在 Tomcat 运行访问路径设置

问题最近用 Tomcat 搭建了个 Jenkins ,但是访问的时候需要端口加 /jenkins/ 才能进行访问.我们是直接将 Jenkins.war 包放在 webapps下的. 我们想直接通过不加路径进行访问. 解决办法思路一在 Host 里面进行配置 path ,经过测试,发现是不行的. <Host name="localhost" appBase="webapps" path="/jenkins" unpackWARs=&qu

eclipse更改web项目访问路径（修改配置文件）

1.打开你的web项目,然后找到 .settings文件夹,如果你的项目中没有这个文件夹,请搜索如何显示web项目中的隐藏文件夹就能够看到了. 2.打开.settings文件夹找到这个文件. 3.在这个文件里面你会看到这个配置,将里面的值改为“/”,就配置好了.以后访问的时候就直接localhost回车就可以了.

vue打包配置发布路径

目的:配置路径,让打包后的dist在本地可以打开. 方法:修改build文件夹下边的的webpack.dev.conf.js文件,找到devServer下边的publicPath,这个来源于config文件,所以找到对应的属性修改成“./”就可以了.

Linux下Tomcat项目访问路径修改

1.去除端口号8080. 首先,进入tomcat的安装目录下的conf目录,我的目录是 /usr/local/apache-tomcat-9.0.20/conf,编辑文件server.xml. 将server.xml中, <Connector port="8080" protocol="HTTP/1.1" connectionTimeout="40000" redirectPort="8443" enableLookup

springboot指定项目访问路径前缀

springboot默认的运行方式是没有项目前缀的如果这时候我们要加上调试或者发布,可以使用下面的方法加上方法:

tomcat去除项目访问路径限制

首先打开tomcat的\apache-tomcat-7.0.73\confserver.xml文件在 </ <Host name="localhost" appBase="webapps" unpackWARs="true" autoDeploy="true"> 省略部分代码.... Host> 之间添加一段代码:<Context path="/" docBase="

springboot系列三、springboot 单元测试、配置访问路径、多个配置文件和多环境配置，项目打包发布

一.单元测试生成的demo里面包含spring-boot-starter-test :测试模块,包括JUnit.Hamcrest.Mockito,没有的手动加上. <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> </dependency> 添加测试类: @RunWith

vue打包后空白页问题全记录（background路径，css js404，jsonp等）；

总结一下vue打包后问题全记录:大部分开发者webpack基本上都是拿来就用的(并没有系统化的研究). 一 >>> 打包之后的静态文件不能直接访问:(例如dist)打包后搭个服务器才能访问的! 选择cd 到dist存放发目录下 npm install http-server -g 二 >>> background引入图片打包后,访问路径错误. 首先static目录下,打包后图片是在根目录下,如果是相对路径肯定是不行的. 然后是assets目录下相对路径是没问题的. 三

vue打包项目访问路径设置

热门专题