问题一:assetsPublicPath配置错误

解决办法:打开config/index.js文件

build:{
        // assetsPublicPath: '/'
        assetsPublicPath: './'
    }

问题二:路由history模式配置有误
router/index.js
解决办法:关闭路由historym模式

export default new Router({
      // mode: 'history', // require service support
      scrollBehavior: () => ({
        y: 0
      }),
      routes: constantRouterMap
    })

执行npm run build之后显示空白页面

阅读数 2858

最近在学习使用webpack,在项目最后打包过程,执行npmrunbuild之后得到的dist目录放到服务器上打开,显示空白页面,但是标题能正常显示,查看控制台发现是数据位置请求报错,查阅资料后知道是... 博文
来自: YooHoeh的博客
关于reactjs在windows环境中使用npm run build之后,打开网页显示为空白的解决方案

npm run build 打包后空白页解决问题两种情况的更多相关文章

  1. Vue打包npm run build 打包后空白怎么解决?

    问题一:路径报错并且页面空白 解决:buld/index.js      assetsPublicPath: '/'修改为 assetsPublicPath: './' 问题二:没报错页面空白  ro ...

  2. npm run build 打包后,如何运行在本地查看效果(Nginx服务)

    这段时间,研究了一下vue 打包的很慢的问题.但是当我 npm run build 打包后,在本地查看效果的时候,活生生被我老大鄙视了,因为我打开了XAMPP.他说:你怎么不用Nginx啊?用这个一堆 ...

  3. 关于npm run build打包后css样式中的图片失效的问题(如background)

    平时run dev都能正常显示的css背景图片在npm run build打包后竟然不显示了(写在标签对中的图片都可以正常显示),而且dist/static/img目录下是确实有这张图片的,于是查看打 ...

  4. npm run build打包后自定义动画没有执行

    问题描述:在vue项目中,当你自己写了一些自定义动画效果,然后你npm run build打包项目放到线上环境后,发现动画并没有效果. 解决办法:在vue项目中找到build文件夹下的vue-load ...

  5. npm run build 打包后,如何查看效果

    我们用vue-cli搭建的项目执行npm build后本地打开页面空白,如果才能查看npm run build之后的结果呢 首先我们看一下提示 Tip: built files are meant t ...

  6. npm run build 打包后(直接打包白屏),如何运行在本地查看效果(Apache服务)

    转载: https://www.cnblogs.com/qiu-Ann/p/7477593.html 目前,使用vue-cli脚手架写了一个前端项目,之前一直是使用npm run dev 在8080端 ...

  7. npm run build 打包后,如何运行在本地查看效果(Apache服务)

    目前,使用vue-cli脚手架写了一个前端项目,之前一直是使用npm run dev 在8080端口上进行本地调试.项目已经进行一半了,今天有时间突然想使用npm run build进行上线打包,试试 ...

  8. npm run build 打包后,如何运行在本地查看效果

    目前,使用vue-cli脚手架写了一个前端项目,之前一直是使用npm run dev 在8080端口上进行本地调试.项目已经进行一半了,今天有时间突然想使用npm run build进行上线打包,试试 ...

  9. 执行npm run build之后显示空白页面

    最近在学习使用webpack,在项目最后打包过程,执行npm run build之后得到的dist目录放到服务器上打开,显示空白页面,但是标题能正常显示,查看控制台发现是数据位置请求报错,查阅资料后知 ...

随机推荐

  1. mysql+jpa简单实现步骤

    首先,我们用的开发工具是IDEA,数据库是mysql,以下是步骤: 1.我们需要在pom.xml加入mysql和jpa的依赖 <!-- 依赖的数据库,使用jpa --> <depen ...

  2. 场景7:带有Linux网桥的提供商网络

    此场景描述了使用带有Linux网桥的ML2插件的OpenStack网络服务的供应商网络实现. 供应商网络通常以灵活性为代价提供简单性.性能和可靠性.与其他场景不同,只有管理员可以管理提供者网络,因为它 ...

  3. FFMPEG学习----打印视频信息

    FFMPEG学习资料少之又少,在此推荐雷神的博客: http://blog.csdn.net/leixiaohua1020 在这里,我们把打印视频里的相关信息作为学习FFMPEG的 Hello Wor ...

  4. MySQL8.0关系数据库基础教程(三)-select语句详解

    1 查询指定字段 在 employee 表找出所有员工的姓名.性别和电子邮箱. SELECT 表示查询,随后列出需要返回的字段,字段间逗号分隔 FROM 表示要从哪个表中进行查询 分号为语句结束符 这 ...

  5. Golang的sync.WaitGroup 实现逻辑和源码解析

    在Golang中,WaitGroup主要用来做go Routine的等待,当启动多个go程序,通过waitgroup可以等待所有go程序结束后再执行后面的代码逻辑,比如: func Main() { ...

  6. Python3 (一) 基本类型

    前言: 什么是代码? 代码是现实世界事物在计算机世界中的映射. 什么事写代码? 写代码是将现实世界中的事物用计算机语言来描述. 一.数字:整形与浮点型 整型:int 浮点型:float (没有单精度和 ...

  7. Docker / Kubernetes 镜像源

    由于众所周知的原因, Docker 官方镜像仓库和 Google 镜像仓库在国内访问速度很慢或者不可用.这样就给我们在部署和使用 Kubernetes 时带来了极大的不便.今天我们就来介绍几种方法,可 ...

  8. day13 JS Dom

    js两种存在形式 1:文件 2:块 放到body标签底部 防止加载js超时页面反应慢的问题 声明变量 name = "sb"; //全局变量 var age=18; //局部变量 ...

  9. Nginx + Linux 性能调优

    Nginx以高性能负载均衡.缓存和web服务器出名,支撑着世界上繁忙网站中的40%.大多数使用场景下,Nginx和Linux系统的默认配置表现较好,但是仍有必要做一些调优以期达到最佳性能. 这篇文章讨 ...

  10. Hello Rust!

    准备工作 Rust是系统编程语言,会经过传统的编译.链接.生成可执行文件等过程.它依赖c/cpp的编译环境,需要提前安装c/cpp开发环境,比如安装gcc及其依赖等. 安装(macOS / Linux ...