vue项目打包后空白

在config/index.js文件中 assetsPublicPath: '/', 改为 assetsPublicPath: './',

build: {
// Template for index.html
index: path.resolve(__dirname, '../dist/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: './',   //在这里将''改成 './'
/**
* Source Maps
*/
productionSourceMap: true,
// https://webpack.js.org/configuration/devtool/#production
devtool: '#source-map',

vue项目打包后背景图路径多了/css/static

在build/utils.js文件中添加publicPath:'../../'

if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath: '../../'
})
} else {

vue打包空白及字体路径错误问题的更多相关文章

  1. 解决Vue打包后背景图片路径错误问题

    1.原因解析 当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片. npm run bu ...

  2. Vue项目开发之打包后背景图片路径错误的坑

    在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...

  3. vue.js 打包时出现空白页和路径错误

    vue-cli输入命令:npm  run  build 即可打包vue.js的项目 打包出来后项目中就会多了一个文件夹dist,下图为我们打包过后的项目 我们直接运行打包后的文件夹中的index.ht ...

  4. vue-cli项目打包出现空白页和路径错误问题

    vue-cli项目打包: 1. 命令行输入:npm  run  build 打包出来后项目中就会多了一个文件夹dist,这就是我们打包过后的项目. 第一个问题,文件引用路径.我们直接运行打包后的文件夹 ...

  5. vue打包后.woff字体文件路径问题处理

    在执行 npm run build 命令打包后,如果出现 .woff 等字体文件找不到的情况 通过设置 vue-style-loader 打包前缀路径解决

  6. Vue项目打包后背景图片路径错误

    vue项目打包之后背景图片出错的解决方案如下: 1,找到 config->index.js里面,如下修改 默认配置: env: require('./prod.env'), index: pat ...

  7. vue-cli搭建的项目打包之后报“资源路径错误&资源文件找不到“

    此方式vue脚手架是3.0版本,2.0版本见最下面//在项目的根目录下(和package.json文件同级)新建一个文件vue.config.js的文件,将此段代码复制进去.module.export ...

  8. vue打包空白,图片没加载,背景颜色没有渲染出来-配置秘诀

    找到config文件夹下的index.js文件修改一下位置 看清楚是 build(上边还有个dev 是开发环境下的配置,不需要改动)下的 assetsPublicPath :将‘/’改为‘./’ 在c ...

  9. vue cli 打包项目造成css背景图路径错误

    vue cli做项目的时候难免会碰到,css引用背景图或者css,js之间的相互引用!!!这时候打包后可能会出现一个错误!!如下图: 写法: 错误: 会无端多出一个“/css/static/” 这样就 ...

随机推荐

  1. Linux学习《第四章shell脚本练习一》随堂练习(重要)

  2. SPOJ_DSUBSEQ Distinct Subsequences

    统计一个只由大写字母构成的字符串的,子串数目,这里指的是子串不是子序列,可以不连续,请注意 然后我按照计数DP的思想,dp[i][j]表示长度为i的子串,最后一个字母为j 然后为了去重,每一次dp的时 ...

  3. Hadoop组件详解(随缘摸虾)

    1.1. Hadoop组成: Hadoop = hdfs(存储) + mapreduce(计算) + yarn(资源协调) + common(工具包) + ozone(对象存储) + submarin ...

  4. vue使用Vant UI中的swiper组件及传值

    子组件SwiperBanner <!-- --> <template> <div class="swiper"> <van-swipe : ...

  5. Day 17:缓冲输出字符流和用缓冲输入输出实现登录、装饰者设计模式

    输出字符流 Writer  所有输出字符流的基类,  抽象类. FileWriter 向文件输出字符数据的输出字符流. BufferedWriter 缓冲输出字符流        缓冲输出字符流作用: ...

  6. struts2 result随笔

     一.result:chain(从一个Action转发到另一个Action) chain结果类型有4个属性,分别是: actionName (default) - the name of the ac ...

  7. java课程课后作业190530之用户体验评价

    每个人评价一下大家手头正在使用输入法或者搜索类的软件产品. 从用户界面.记住用户选择.短期刺激.长期使用的好处坏处.不要让用户犯简单的错误四个方面发表一篇博客. 输入法:苹果自带的输入法 用户界面:简 ...

  8. Community Cloud零基础学习(三)Partner Account

    本篇参考:http://salesforce.vidyard.com/watch/bLE3QNRSej2iasw9vvc6Tk http://salesforce.vidyard.com/watch/ ...

  9. Android尺寸单位

    px:pixels(像素),1px的长度对应屏幕一个像素点的大小. dp/dip:(density-independent pixels,设备无关像素) sp:scaled pixels(可缩放像素) ...

  10. 吴裕雄--天生自然 JAVASCRIPT开发学习: Break 和 Continue 语句

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...