打包之后打开dist的页面显示空白：

1、记得改一下config下面的index.js中bulid模块导出的路径。

这里需要将 assetsPublicPath: '/'改为assetsPublicPath: './',

2.也有可能是因为背景图片路径没有配置需要在build/utils.js添加配置publicPath: '../../'

vue 打包后，页面空白及图片路径的问题的更多相关文章

  1. vue build打包后css里的图片路径404不正确的问题

    vue build打包后css里的图片路径404 在vue-cli项目中build/utils.js中找到如下代码块,添加 publicPath:’../../’ if (options.extrac ...

  2. vue打包后显示空白正确处理方法

    vue打包后显示空白正确处理方法是 1.找到配置文件(js与css加载不上) 修改 这样打包处理可以打开但是页面样式会找不到 2.修改(针对css中的图片加载不上) 找到对应的位置加上publicPa ...

  3. vue打包后页面显示空白但是不报错

    在使用vue打包的时候页面显示空白,并且控制台不报错 设置vue-router的时候mode设置为history模式了,这种模式要有后台的配合,一般还是使用哈希模式就不会出现页面空白了.

  4. Vue打包后页面出现cannot get

    学习Vue有大半个月了,然而遇到了不少坑,完全没有高手们那么容易,中间有不少值得记录下的东东,回头好好理理.先理下今天的: Vue打包命令简单啊,直接在命令行输入:npm run build 然而没一 ...

  5. vue打包后找不到资源路径问题

    问题描述: 使用webpack打包vue项目后,前后端联调无法找到资源 解决方案: 一. 改为相对路径,去除axios中地址的第一个“/” onProxyReq: function (proxyReq ...

  6. vue打包之后找不到图片路径，打包项目时，dist文件夹内部分图片找不到

    1.打包项目时,会默认把存放在public内的小于4k的图片转换成base64,作为内联样式. 可以在vue.config.js中修改默认大小,在chainWepack:config=>{}中添 ...

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

    总结一下vue打包后问题全记录:大部分开发者webpack基本上都是拿来就用的(并没有系统化的研究). 一 >>> 打包之后的静态文件不能直接访问:(例如dist)打包后搭个服务器才 ...

  8. vue打包后js和css、图片不显示，引用的字体找不到问题

    vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...

  9. vue打包后运行在本地/非服务器端环境的访问路径

    vue打包前的配置: 项目目录下--> config文件夹---> index.js: build:  { assetsPublickPath:  './',   // 设置成相对路径   ...

随机推荐

  1. JSP Web第七章整理复习 Servlet基础知识

    P206-208 Servlet项目的创建,web.xml的配置及标签含义,相关程序 创建:new 一个Servlet类,继承自javax.servlet.http.HttpServlet; 写doG ...

  2. date、cal和clear命令

    一.date命令 date命令的功能:date命令是显示或设置系统时间与日期. 很多shell脚本里面需要打印不同格式的时间或日期,以及要根据时间和日期执行操作.延时通常用于脚本执行过程中提供一段等待 ...

  3. 【JZOJ3213】【SDOI2013】直径

    ╰(￣▽￣)╭ 小 Q最近学习了一些图论知识.根据课本,有如下定义. 树:无回路且连通的无向图,每条边都有正整数的权值来表示其长度.如果一棵树有N个节点,可以证明其有且仅有 N-1 条边. 路径:一棵 ...

  4. 集合--Collection接口详解&&迭代器

    /* * 集合的顶层接口--Collection接口 * 添加 * add() * addAll() * * 遍历集合 * iterator() 迭代器 * * 删除 * remove() * rem ...

  5. 《第一行代码》之——1.Android简介

    Android简介 Android系统架构 (图片源自维基百科) Android大致分为四层架构,五块区域. Linux内核层 Android系统基于Linux2.6,这一层为Android设备的各种 ...

  6. C++之MD5加密（签名）

    md5.h : #include <stdio.h> #include <stdlib.h>#include <time.h> #include <strin ...

  7. map的三种遍历方法！

    map的三种遍历方法!   集合的一个很重要的操作---遍历,学习了三种遍历方法,三种方法各有优缺点~~ /* * To change this template, choose Tools | Te ...

  8. 2019-8-31-dotnet-控制台-Hangfire-后台定时任务

    title author date CreateTime categories dotnet 控制台 Hangfire 后台定时任务 lindexi 2019-08-31 16:55:58 +0800 ...

  9. centos安装php7.18注意

    报错–php53-common conflicts with php-common //解决 yum -y install php* --skip-broken 第一步:安装源 yum install ...

  10. ADO.NET_01

    一.说明 这个例子是小白跟着学习代码记录,模拟用户登陆功能,提示用户输入用户名及密码,然后与数据库里的用户数据进行比对,成功就返回成功提示及邮箱,失败,则失败提示. 二.代码 共3个文件,如下. Ap ...