vue+history+iis+webpack 白屏并且提示 Uncaught SyntaxError: Unexpected token

于 2024-08-27 13:33:46 发布
阅读量83 收藏
点赞数 4
分类专栏： webpack 文章标签： vue.js webpack 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/changyandou2020/article/details/141600576
版权

开发环境下不论是使用hash模式，还是history模式，都可以正常使用。但是当产品编译后发布到测试环境、生产环境的时候，就会出现页面空白，或者指向了iis的默认页面。通过如下过程解决这个问题：

1.安装urlrewrite，配置重定向

windows上重定向的软件，不需要四处搜罗，如果又是 urlrewrite.exe，又是rewrite_x64_zh-CN，又是改注册表，就说明走弯路了。

直接在官方的Vue Router中，有说明：
在这里插入图片描述
（图片来自：https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E5%8E%9F%E7%94%9F-node-js）

了解本专栏 订阅专栏 解锁全文 超级会员免费看
问问计算机
关注
  • 4
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
订阅专栏
Vue项目报错：Uncaught SyntaxError: Unexpected token <
10-17
主要介绍了Vue项目报错：Uncaught SyntaxError: Unexpected token <，在引入第三方依赖的 JS 文件时，遇到的一个问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Vue项目报错：Uncaught SyntaxError: Unexpected token
01-19
控制台的提示：Uncaught SyntaxError: Unexpected token < 按照提示进入文件，再看如下图： 仔细看了看 index.html 文件,发现原本我的 JS 文件是放在 /src/utils 文件夹下的，但引入 /src 和 /static 的文件是...
已解决Uncaught SyntaxError: Unexpected token ‘＜‘
03-27 8万+
它表明在代码中有一个意外的字符，尤其是一个不被期望的尖括号
解决 Uncaught SyntaxError: Unexpected token ‘＜‘ 解决方法
热门推荐
HeXinT的博客
06-01 18万+
解决 Uncaught SyntaxError: Unexpected token ‘＜‘ 解决方法，打包出现的问题，解决方案
（vite/webpack 通用）vue 白屏 Uncaught Syntaxerror: Unexpected token ‘?‘
07-13 3510
浏览器一片空白，开控制台输出：Uncaught Syntaxerror: Unexpected token?vite代码版本较高，导致低版本浏览器无法运行，结果是他那边浏览器的版本很低(谷歌44)导致的。
Uncaught SyntaxError: Unexpected token ... 【bug记录】vue项目发布
成茂峰
02-02 2330
项目场景：部署，组件或页面html使用ES6语法导致，界面无法显示。
VUE项目IIS部署出现：Uncaught SyntaxError: Unexpected token ＜ 报错解决方案
weixin_43163153的博客
01-10 171
1.第一个解决方法是把mode改成history这个问题就会消失 2.第二个解决方法是publicPath设置成’/’,不能是’./’ const publicPath=''; module.exports = { // publicPath: process.env.NODE_ENV === 'production' ? '/lucky-draw' : '/' publicPath: ...
【前端疑难杂症】Vue 项目报错Uncaught SyntaxError: Unexpected token ＜
FortheOne的博客
02-28 1万+
Uncaught SyntaxError: Unexpected token <
使用vue-cli,webpack打包报错：Uncaught SyntaxError: Unexpected token <
E_li_na的博客
05-16 2万+
今天在用vue-cli搭建项目的时候使用webpack打包后出现了这个错误。网上搜了发现之所以有这个错误是因为js中用了es6语法，在编译时没有转译成es5语法。看了下bundle.js文件，果然没有将es6转为es5！但是vue-cli下载下来的webpack那个模板已经集成了babel，相关设置在.babelrc这个文件里,不会是没有相关的包啊·。然后就想到webpack官网说要安装LTS版本...
vue 路由跳转history模式报Uncaught SyntaxError: Unexpected token ‘＜‘
weixin_51125242的博客
04-29 1484
这个坑超级坑，独立搭过项目的兄弟应该会遇到,控制台报这个错 是不是摸不着头脑？ ● publicPath ●Type: string ●Default: ‘/’ 部署应用包时的基本URL。用法和webpack本身的output . publicPath-致, 但是VueCL在一其 他地方也需要用到这个值，所以请始终使用publicPath 而不要直接修改webpack的output . publicPath。 默认情况下，Vue CLI会假设你的应用是被部署在一个域名的根路径上
Vue项目报错Uncaught SyntaxError: Unexpected token ‘＜‘
weixin_43727560的博客
03-01 1万+
vue项目使用history模式访问route，发布线上时直接复制路径访问页面，页面空白，报错Uncaught SyntaxError: Unexpected token '<'。如何更改配置解决问题，包括static路径错误、nginx配置增加
vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错
10-17
主要介绍了vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue-cli 打包后提交到线上出现 “Uncaught SyntaxError:Unexpected token” 报错
01-21
前言: 项目使用vue-cli版本2.9.3 ,vue-router...页面全白,console打印:Uncaught SyntaxError:Unexpected token < 报错截图: 经过一番折腾,初步定位问题1在经过build/webpack.prod.conf.js的chunkhash打包后的JS文
无界微前端实践(vue3+vite+vue2+webpack)
10-24
其中主应用使用了vue3+vite，子应用使用了vue2+webpack。页面简洁明朗，学习成本低。搭配本人关于无界微前端的博客使用更佳。博客地址：https://blog.csdn.net/bDreamer/article/details/127103459 适合人群：需要...
Ant Design Vue 快速上手指南与常见问题排查
windowshht的博客
08-22 1162
Ant Design Vue 是一款功能强大的 Vue 组件库，能够帮助开发者快速构建高质量的用户界面。通过本文的快速上手指南，您可以轻松地在项目中集成 Ant Design Vue，并解决常见问题。希望这篇文章能为您的开发工作提供帮助，提升您的开发效率。如需深入了解 Ant Design Vue 的更多功能和组件，请参考Ant Design Vue 官方文档。
vue ref和reactive区别
最新发布
灰海
08-25 543
在第二个示例中，我们使用了reactive来创建一个名为state的响应式对象，它包含name和age两个属性。在模板中，我们通过{{ state.name }}和{{ state.age }}来显示state对象的属性值。在第一个示例中，我们使用了ref来创建一个名为count的响应式引用，它是一个简单的数字类型。在模板中，我们通过{{ count }}直接显示count的值，而不需要.value前缀，因为Vue的模板语法会自动处理ref的.value访问。
基于vue3和audio封装的简易音频播放器
weixin_43734732的博客
08-23 337
【代码】基于vue3和audio封装的简易音频播放器。
vue export的用法
weixin_41203765的博客
08-23 371
在Vue.js中，export关键字主要用于模块化编程，它允许你将一个文件（模块）中的代码、组件、函数、变量等导出，以便在其他文件中通过import语句来使用。这在Vue项目中非常常见，特别是当你需要重用组件、工具函数或配置时。
vue添加了webpack的publicpath配置uncaught syntaxerror: unexpected token '<
08-30
uncaught syntaxerror: unexpected token '<的错误通常是指在使用Vue.js和webpack打包工具时，浏览器无法正确加载生成的打包文件。而这个错误的产生往往是由于webpack的publicPath配置问题导致的。 publicPath配置项的作用是指定webpack打包生成的静态资源的路径前缀。当配置不正确时，浏览器在加载资源时会发出错误请求，从而导致uncaught syntaxerror: unexpected token '<错误。 解决这个问题的方法是对publicPath进行正确的配置。一般来说，publicPath的值应该与项目部署的路径相对应。例如，如果项目部署在根路径下，publicPath的值应该设置为'/'，而如果项目部署在子路径下，publicPath的值应该设置为对应的子路径。 在Vue.js的配置文件中（如webpack.config.js或vue.config.js），可以添加类似如下的配置代码来设置publicPath： module.exports = { publicPath: process.env.NODE_ENV === 'production' ? '/my-app/' : '/' }; 这样设置之后，在生成的打包文件中，浏览器就能正确加载静态资源，不再出现uncaught syntaxerror: unexpected token '<错误。 总结起来，vue添加了webpack的publicPath配置是为了解决浏览器加载webpack打包生成的静态资源时出现uncaught syntaxerror: unexpected token '<错误的问题，可以通过在配置文件中正确设置publicPath来解决这个错误。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

问问计算机

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值