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

找到webpack配置文件.webpack.js

需要说明,不同的webpack版本或者打包管理器所生成的配置文件名甚至文件位置都可能不一样,不清楚自己项目配置文件位置在哪的可以通过全局搜索publicPath或者assetsPublicPath来找到配置文件。

publicPath:'/'修改为publicPath:'./'

重新执行`npm run build打包

一般来讲都可以解决问题,如果仍有问题,可以留言一起讨论。

执行npm run build之后显示空白页面的更多相关文章

  1. npm run build 打包后空白页解决问题两种情况

    问题一:assetsPublicPath配置错误 解决办法:打开config/index.js文件 build:{        // assetsPublicPath: '/'        ass ...

  2. vue-electron 使用sqlite3数据库,执行npm run build 报错 .NET Framework 2.0 SDK,Microsoft Visual Studio 2005[C:\temp\wechat\node_modules\sqlite3\build\binding.sln]

    问题描述 vue-electron 使用sqlite3数据库,执行npm run build 报错如下: .NET Framework 2.0 SDK,Microsoft Visual Studio ...

  3. 如何使用 gitlab 或 github 执行npm run build

    一: 如何快速搭建一个组件库 首先,我们介绍一个快速包装组件库的工具:https://github.com/yanhaijing/jslib-base     按照文档来,就简单几步: npx @js ...

  4. vue中执行npm run build报错解决方法?

    遇到了执行npm run build 后报错: [build:js ] Module not found: Error: Can't resolve 'scss-loader' in 'D:\work ...

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

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

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

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

  7. vue使用npm run build命令打包

    vue使用npm run build命令打包项目   当我们使用vue-cli脚手架完成一个项目的时候,下一步肯定会想要怎么把这个项目放到互联网上或者本地直接打开呢,我们在本地调试的时候只要命令行执行 ...

  8. Electron 桌面应用打包(npm run build)简述(windows + mac)

    最近一段时间在用electron+vue做内部项目的一键构建发布系统的桌面应用,现就其中打包流程写个备注,以示记录. Windows环境打包:1.首先贴一下package.json. { " ...

  9. vue npm run build 失败

    之前删除过 node-moudel 文件夹,然后 npm install 重新安装,一切OK.打包的时候,报错,找不到caniuse什么的.再删除node-moudel,重新cnpm install ...

随机推荐

  1. Python数据类型之字符串

    一:概述 Python中的字符串的一些概念 可以看作是字符的集合,在数据类型里没有单个字符的数据类型,可以用单个字符表示的一个字符串数据类型 字符串是一种不可变的序列类型,单个字符从左到右按照顺序排列 ...

  2. mysql 简称

    一:DTS(Data Transformation Service) 数据转换服务 大多数组织都使用多种格式和多个位置来存储数据. 为了支持决策.改善系统性能或对现有系统进行升级,经常必须将数据从一个 ...

  3. php把一些预定义的 HTML 实体转换为字符。

    htmlspecialchars_decode() echo htmlspecialchars_decode($condition,ENT_QUOTES) '  会被转成 单引号

  4. nginx proxy_pass指令’/’注意事项

    1. proxy_pass配置说明 不带/ location /test/ { proxy_pass http://t6:8300; } 带/ location /test/ { proxy_pass ...

  5. python生成随机日期字符串

    python生成随机日期字符串 生成随机的日期字符串,用于插入数据库. 通过时间元组设定一个时间段,开始和结尾时间转换成时间戳. 时间戳中随机取一个,再生成时间元组,再把时间元组格式化输出为字符串 # ...

  6. 禁止root直接登陆linux系统

    直接修改文件 # vim /etc/ssh/sshd_config SyslogFacility AUTHPRIV PermitRootLogin no RSAAuthentication yes P ...

  7. NOIP2017提高组Day1T3 逛公园 洛谷P3953 Tarjan 强连通缩点 SPFA 动态规划 最短路 拓扑序

    原文链接https://www.cnblogs.com/zhouzhendong/p/9258043.html 题目传送门 - 洛谷P3953 题目传送门 - Vijos P2030 题意 给定一个有 ...

  8. 防止vs编译时自动启动单元测试

    Tools → Options → Live Unit Testing   Pause 勾选

  9. P1101 单词方阵 简单dfs

    题目描述 给一n \times nn×n的字母方阵,内可能蕴含多个“yizhong”单词.单词在方阵中是沿着同一方向连续摆放的.摆放可沿着 88 个方向的任一方向,同一单词摆放时不再改变方向,单词与单 ...

  10. Python 2 和 3 的区别记录

    Python 2 和 3 的区别记录 print 2:关键字,可以 print a,也可以 print(a) 3:内置函数,必须带(),print(a) reload() 2:内置函数,可以直接使用 ...