执行npm run build之后显示空白页面
最近在学习使用webpack,在项目最后打包过程,执行npm run build之后得到的dist目录放到服务器上打开,显示空白页面,但是标题能正常显示,查看控制台发现是数据位置请求报错,查阅资料后知道是打包初始目录设置错误,现将解决方法整理如下:
找到webpack配置文件.webpack.js
需要说明,不同的webpack版本或者打包管理器所生成的配置文件名甚至文件位置都可能不一样,不清楚自己项目配置文件位置在哪的可以通过全局搜索
publicPath或者assetsPublicPath来找到配置文件。
将publicPath:'/'修改为publicPath:'./'
重新执行`npm run build打包
一般来讲都可以解决问题,如果仍有问题,可以留言一起讨论。
执行npm run build之后显示空白页面的更多相关文章
- npm run build 打包后空白页解决问题两种情况
问题一:assetsPublicPath配置错误 解决办法:打开config/index.js文件 build:{ // assetsPublicPath: '/' ass ...
- 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 ...
- 如何使用 gitlab 或 github 执行npm run build
一: 如何快速搭建一个组件库 首先,我们介绍一个快速包装组件库的工具:https://github.com/yanhaijing/jslib-base 按照文档来,就简单几步: npx @js ...
- vue中执行npm run build报错解决方法?
遇到了执行npm run build 后报错: [build:js ] Module not found: Error: Can't resolve 'scss-loader' in 'D:\work ...
- Vue打包npm run build 打包后空白怎么解决?
问题一:路径报错并且页面空白 解决:buld/index.js assetsPublicPath: '/'修改为 assetsPublicPath: './' 问题二:没报错页面空白 ro ...
- npm run build 打包后,如何查看效果
我们用vue-cli搭建的项目执行npm build后本地打开页面空白,如果才能查看npm run build之后的结果呢 首先我们看一下提示 Tip: built files are meant t ...
- vue使用npm run build命令打包
vue使用npm run build命令打包项目 当我们使用vue-cli脚手架完成一个项目的时候,下一步肯定会想要怎么把这个项目放到互联网上或者本地直接打开呢,我们在本地调试的时候只要命令行执行 ...
- Electron 桌面应用打包(npm run build)简述(windows + mac)
最近一段时间在用electron+vue做内部项目的一键构建发布系统的桌面应用,现就其中打包流程写个备注,以示记录. Windows环境打包:1.首先贴一下package.json. { " ...
- vue npm run build 失败
之前删除过 node-moudel 文件夹,然后 npm install 重新安装,一切OK.打包的时候,报错,找不到caniuse什么的.再删除node-moudel,重新cnpm install ...
随机推荐
- WCF寄宿IIS
1.创建一个简单的wcf项目 创建完成后直接运行,结果 然后进行发布 在IIS上新建一个网站,直接进行发布即可 遇到的问题 请求与通配符 mime 映射相匹配.请求映射到静态文件处理程序. 需要注意的 ...
- mysql 查询结果中增加序号
) as rownum,person_id from t_base_person
- Tensorflow name_scope
在 Tensorflow 当中有两种途径生成变量 variable, 一种是 tf.get_variable(), 另一种是 tf.Variable(). 使用tf.get_variable()定义的 ...
- 线程 ID
摘自<Linux 环境编程:从应用到内核> 在 Linux 中,目前的线程实现是 Native POSIX Thread Library,简称 NPTL.在这种实现下,线程又被称为轻量级进 ...
- java运算符-逻辑、三元运算符
1.逻辑运算符 逻辑运算符,它是用于布尔值进行运算的,运算的最终结果为布尔值true或false. 运算符 运算规则 范例 结果 & 与 false&true False | 或 fa ...
- 【BZOJ2560】串珠子
题解: 跟n个点有标号的无向连通图个数几乎一模一样 直接上代码了 代码: #include <bits/stdc++.h> using namespace std; #define ll ...
- 【C#】使用OWIN创建Web API
OWIN的介绍 OWIN 的全称是 "Open Web Interface for .NET", OWIN 在 .NET Web 服务器和 .NET Web 应用之间定义了一套标准 ...
- 【Android】ContentValues的用法
ContentValues 和HashTable类似都是一种存储的机制 但是两者最大的区别就在于,contenvalues只能存储基本类型的数据,像string,int之类的,不能存储对象这种东西,而 ...
- 解决 Ionic 浏览器跨域问题
<system.webServer> <httpProtocol> <customHeaders> <add name="Access-Contro ...
- Codeforces 653F Paper task SA
Paper task 如果不要求本质不同直接st表二分找出最右端, 然后计数就好了. 要求本质不同, 先求个sa, 然后用lcp求本质不同就好啦. #include<bits/stdc++.h& ...