vue项目的打包

更改config文件夹下的index.js里的assetsPublicPath路径    将 “/”  改为  “./”

 build: {
env: require('./prod.env'),
index: path.resolve(__dirname, '../dist/index.html'),
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: './',
productionSourceMap: true,
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
bundleAnalyzerReport: process.env.npm_config_report
}

1:原本路径是指向根目录,什么是根目录?

根目录:在计算机的文件系统中,根目录逻辑驱动器的最上一级目录,它是相对子目录来说的;它如同一棵大树的“根”一般,所有的树杈以它为起点,故被命名为根目录。以微软公司开发的Windows操作系统为例:打开我的计算机(计算机),双击C盘就进入C盘的根目录。双击D盘就进入D盘的根目录

  • ../ 父级目录

  • ./当前目录

2:css背景图片打包找不到的问题?

打包后,不管原先的图片资源在哪里,路径通通变成static/img/xxxx ,若在HTML里的IMG标签的src引入图片,则正常显示,因为路径是从 index.html 开始寻找的,所以static/img/xxxx是能正确访问到图片。

但是在css/app.css里,在当前的CSS目录下,无 static/img 路径,所以资源找不到。而背景图片要回退两级才能正确访问到.

index.html 
      static 
      | --img 
          | --图片.jpg
      | --css 
          | --app.css 
      | --js

| --app.js

解决方法:build->utils.js

Vue项目的打包的更多相关文章

  1. vue项目 构建 打包 发布 三部曲

    一.vue项目的创建 1.首先第一肯定是要有Node.js及npm这个不多说了2.安装脚手架 此时可以直接浏览-但是现在肯定有很多小白想将他发布到gitHub上并可以浏览,使用vue全家桶制作自己的博 ...

  2. vue项目如何打包扔向服务器

    vue项目如何打包扔向服务器   当我们将 vue 项目完成后,面临的就是如何将项目进行打包上线,放到服务器中.我使用的是 vue-cli(simple) 脚手架,所以就讲一下如何将项目进行打包,并放 ...

  3. vue项目webpack打包后有的文件big 问题

    vue项目打包的时候,有的big, 超过1M,   需要进行优化,方法有: 1.  非首屏图片,可以采用懒加载的方式,  如:图片的懒加载,  vue中路由的懒加载 等 2. 各个模块, 采用如sea ...

  4. vue项目如何打包前后端不分离发布手把手教学apache、nginx

    vue项目如何不分离发布 1.首先yarn build 我用了vue-cli脚手架,bulid后的dist文件夹里的index.html有加版本号,那么为什么需要加版本号呢? a.回滚 b.解决浏览器 ...

  5. vue项目 webpack打包后,图片路径是绝对路径

    vue项目,使用webpack打包,虽然在全局把路径改成了相对的路径,但是图片引用的路径还是异常的,解决办法如下: 1.config文件夹下index.js中: assetsPublicPath:&q ...

  6. Springboot项目与vue项目整合打包

    我的环境 * JDK 1.8 * maven 3.6.0 * node环境 1.为什么需要前后端项目开发时分离,部署时合并? 在一些公司,部署实施人员的技术无法和互联网公司的运维团队相比,由于各种不定 ...

  7. vue项目中打包编译后,CSS样式【-webkit-box-orient: vertical】打包后丢失问题

    最近在做vue项目的时候页面处理多行文本样式时用到了-webkit-box-orient: vertical这个属性,本地跑项目没问题,但是打包放到服务器后发现这个属性丢失了.如下图: 后来在网上查了 ...

  8. Vue项目如何打包问题总结

    当我们将 vue 项目完成后,面临的就是如何将项目进行打包上线,放到服务器中.我使用的是 vue-cli(simple) 脚手架,所以就讲一下如何将项目进行打包,并放到 tomcat 上. 先来描述一 ...

  9. 配置vue项目将打包后图片文件的引用路径改为cdn路径?

    vue cli3项目, 需求: 图片文件打包时, 将项目内的所有图片文件的引用地址改为cdn路径 vue cli3的默认配置下, 打包后图片使用的是相对路径, 例如打包后项目内图片引用路径为 img/ ...

随机推荐

  1. vscode下运行matlab记录

    Linux下安装MATLAB可参照以下链接: https://blog.csdn.net/qq_31285709/article/details/82083902 在vscode 中运行.m文件. 首 ...

  2. 20165306 Exp5 MSF基础应用

    Exp5 MSF基础应用 一.实践概述 1. 实践内容 本实践目标是掌握metasploit的基本应用方式,重点常用的三种攻击方式的思路.实现: 1.1一个主动攻击实践 ms08-067+window ...

  3. Linux下“/”和“~”的区别

    在linux中,”/“代表根目录,”~“是代表目录.Linux存储是以挂载的方式,相当于是树状的,源头就是”/“,也就是根目录. 而每个用户都有”家“目录,也就是用户的个人目录,比如root用户的”家 ...

  4. Unity3d外包—就找北京动点软件(长年承接Unity3d软件、游戏项目外包)

    承接Unity3d体感企业项目.游戏项目外包 北京公司.专业团队,成员为专业Unity3d产品公司一线开发人员,有大型产品开发经验: 提供优质的售后服务,保证产品质量,轻量级产品可以提供规范清晰的源代 ...

  5. contenOs7编码问题

  6. python打包exe

    https://www.imooc.com/article/246868 虽然在3.7下报错了,但是先码

  7. 高阶函数 map、reduce、filter、sort 函数计算

    map() 循环遍历,返回一个新数组 ,reduce()把结果继续和序列的下一个元素做累积计算 把一个字符串13579先变成Array--[1, 3, 5, 7, 9],再利用reduce()就可以写 ...

  8. 禁止root登陆sshd/并修改默认端口号

    1,新建一个用户: #useradd xxx 2,为新用户设置密码: #passwd xxx 3,修改sshd配置文件 #vi /etc/ssh/sshd_config 查找“#PermitRootL ...

  9. Notepad++编译和运行C语言 (GCC)

    我们在学习C语言的时候,实际上只需要编译器和编辑器就能开搞了.(初学者过早接触IDE不利于理解程序构建的过程) 在看这篇文章的时候,假设你已经知道如何把GCC配置到环境变量,并且会在命令行/终端下使用 ...

  10. iptables命令使用详解

    iptables的主要功能是实现对网络数据包进出设备及转发的控制.当数据包需要进入设备.从设备中流出或者经该设备转发.路由时,都可以使用iptables进行控制. 环境 操作系统:CentOS7.3 ...