一般vue使用webpack打包是整个工程的根目录，但是很多情况下都是把vue打包后的文件在某子目录下。

修改：

1，打开index.js

assetsPublicPath:'/'

改为：

assetsPublicPath: './'

2.解决css里面的路径问题，打开utils.js

添加红色框参数即可；

publicPath: '../../'

注意：当路由使用 mode: 'history' 时，去了路径的#，但是需要后端配合配置。这时候不要用相对路径~

vue和webpack打包 项目相对路径修改的更多相关文章

  1. vue 使用webpack打包后路径报错以及 alias 的使用

    一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...

  2. vue之webpack打包工具的使用

    vue之webpack打包工具的使用 一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个 ...

  3. 如何使用webpack打包项目

    webpack是前端开发中比较常用的打包工具之一,另外还有gulp,grunt.之前没有涉及过打包这块,这里介绍一下使用webpack打包的流程. Grunt和Gulp的工作方式是:在一个配置文件中, ...

  4. vue项目之webpack打包静态资源路径不准确

    摘自:https://blog.csdn.net/viewyu12345/article/details/83187815 问题 将打包好的项目部署到服务器,发现报错说图片找不到. 静态资源如js访问 ...

  5. 【vue】饿了么项目-使用webpack打包项目

    1.vue cli给我们提供了npm run build命令打包项目,在packa.json文件中scripts对象中有build属性,当我们执行npm run build时,就执行build对应的& ...

  6. 10. vue之webpack打包详解

    一.什么是webpack webpack官网给出的定义是 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应 ...

  7. vue通过webpack打包后怎么运行

    1. 成功使用webpack打包完成后会默认得到dist的文件夹 2. dist文件夹中有html与其他的静态文件 3. 在dist文件夹中打开命令窗口或者git,开一个服务器(像anywhere) ...

  8. vue的webpack打包

    一个完整的项目离不开 开发环境 生产环境 测试环境 这三个环境 首先解释一下这三个环境的含义 开发环境:开发环境是程序猿们专门用于开发的服务器,配置可以比较随意,为了开发调试方便,一般打开全部错误报告 ...

  9. vue结合webpack打包问题

    在使用vue开发项目时,如果要使用其单文件组件特性,必然要使用webpack或者其他打包工具打包,这里我用到的是webpack打包,首先是搭建vue环境和webpack环境,在这里遇到的一个问题是在成 ...

随机推荐

  1. js函数式编程——蹦床函数

    概述 这是我在学习函数式编程的时候,关于递归,尾递归,相互递归和蹦床函数的一些心得,记下来供以后开发时参考,相信对其他人也有用. 参考资料:JavaScript玩转Clojure大法之 - Tramp ...

  2. Mybatis框架一：搭建测试

    Mybatis框架不再介绍: 在JDBC中存在一些问题: 1.频繁连接和释放资源浪费内存 2.编码完成后不便于维护 于是产生了简化数据库操作的框架:Hibernate.Mybatis等等,这里介绍My ...

  3. 使用jedis连接redis

    1.导入jar包,添加pom依赖<dependency><groupId>redis.clients</groupId><artifactId>jedi ...

  4. mysql 开发进阶篇系列 25 数据库RPM安装目录介绍

    一.概述 mysql可以在多个平台上运行,在windows平台上安装有noinstall包和图形化包二种方式.在linux/unix平台上有RPM包安装,二进制包(Binary Package)安装, ...

  5. Eclipse 项目导入 Android Studio 导致的乱码问题

    最近有一个 Eclipse 项目导入 Android Studio 1.4 时出现乱码,Build 提示 Error:(38, 5) 閿欒: 缂栫爜UTF-8鐨勪笉鍙槧灏勫瓧绗?. 源代码是 GB ...

  6. mac下nginx搭建

    首先使用brew安装nginx brew install nginx 安装完毕后,如果我们要使用nginx监听本地的80端口,需要改掉mac自带的apache占用的80端口 sudo vim /etc ...

  7. Unity3D鼠标坐标转世界坐标和局部坐标

    鼠标坐标转世界坐标和局部坐标: Vector3 MousePosition2Local () { mousePosition = Input.mousePosition; //获取屏幕坐标 mouse ...

  8. SPL接口学习总结

    迭代器接口描述(接口在C里定义,这只是描述) interface Iterator { public function current(); public function key(); public ...

  9. MySQLdump之single-transaction详解

    MySQLdump之single-transaction详解 single-transaction 开启general log选项 查看目前general log的情况 mysql> show ...

  10. 关于toggle事件委托的处理

    当html页面加载后,页面上需要再次动态加载的按钮等事件的绑定,我们有两种处理方案 一.再次加载后进行绑定 二.使用委托进行绑定 而toggle事件是无法直接绑定的,这时可以转化为click的事件,并 ...