vue项目启动时显示SyntaxError: Unexpected token { at createScript..

最新推荐文章于 2025-03-19 16:03:52 发布
最新推荐文章于 2025-03-19 16:03:52 发布
阅读量3.6k 收藏 2
点赞数 4
分类专栏： 软件安装 文章标签： vue node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42566993/article/details/125588668
版权

问题描述：vue项目启动时显示SyntaxError: Unexpected token { at createScript..

问题原因：node版本太低导致的。

问题解决：windows环境的直接去官网下最新稳定版本即可，mac/linux环境的使用

  1. 清除node缓存：npm cache clean -f
  2. 安装n模块：npm install -g n
  3. 下载最新稳定版：n stable
使用ES6模块化出现“Uncaught SyntaxError: Unexpected token {”这种错误的解决方案
老曹的博客
08-13 8466
起因 之前使用ES6模块化场景要么就是在vue-cli，要么就是webpack或者babel中编译好使用的，如今很多浏览器已经支持这个语法了，比如： Safari 10.1. Chrome 61. Firefox 60. Edge 16. 心血来潮的我立马弄了个demo。我在main.js中引入了一个hello模块，下面是目录结构和代码： hello.js const sayHi = nam...
js vm报错,SyntaxError：createScript处的无效或意外令牌（vm.js：80：10）
weixin_31937319的博客
01-17 3093
I've just arted to learn node, and when executing a very simple app from a powershell terminal:node app.jsI am getting the following exception:SyntaxError: Invalid or unexpected tokenat createScript (...
js Uncaught SyntaxError: Unexpected token ‘＜‘ (at polyfills.js:1:1)
PrimaryColor
03-19 716
总结：根据文件引入路径未发现当前文件，所以报错，需要确认是否真实存在，或者引入路径是否正确。这个错误通常发生在 JavaScript 代码执行时，浏览器解析到。在浏览器控制台中检查。
JS SyntaxError: Unexpected token 报错解决
我是 二川兄，对Web开发、GIS开发、3D模型、机器学习、面试技巧等方面都有一些涉猎~ 欢迎您加入技术交流圈！你可以在我的文章末尾找到我~
08-21 1万+
JS SyntaxError: Unexpected token 报错解决
Vue 项目报错：Syntax Error:Unexpected token 和 Module build failed: Error: No PostCSS Config found in...
涤生的博客
10-07 4616
以下分别对标题中的两个报错做出解答： 问题一描述：Vue 项目运行报错(提示：Syntax Error:Unexpected token)，且报错提示位于扩展运算符 原因：Vue 项目构建不支持扩展运算符，需要手动配置 解决方法： 在项目根目录手动创建一个 .babelrc 文件，将下面内容写入该文件后重新 npm run dev 即可 { "presets": [ "stage-2" ] } 问题二描述：Vue 项目运行构建报错(提示：Module build failed: Er
Vue 项目启动抛出 Syntax Error/ Unexpected token
u010565037的博客
10-12 3545
项目启动时抛出了标识符无法识别的错误 错误原因 ES6 新增了不少标识符，但浏览器大多无法直接识别，需要借助babel对 ES6 代码进行转义 项目启动时抛出如下错误，表示...运算符没能被识别，该运算符属于 ES6 的解构运算符 出现该问题的原因基本上可以定位是项目没有配置babel 即时package.json文件中已经引入babel，但仍然需要在项目根目录创建一个.balbelrc文件进行配置 解决方式 在项目根目录创建.babelrc文件即可实现对ba...
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 的文件是...
JS提示：Uncaught SyntaxError:Unexpected token ) 错误的解决方法
10-21
主要介绍了JS提示：Uncaught SyntaxError:Unexpected token ) 错误的解决方法,结合实例形式分析了javascript提示此类异常的常见原因与相关解决方法,需要的朋友可以参考下
vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错
10-17
主要介绍了vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue项目出现Uncaught SyntaxError: Unexpected token ＜ 解决方案
热门推荐
oopxiajun博客专栏
08-25 5万+
现象 开发 测试 启动 npm run dev 能正常访问 打包 npm run build 后访问页面出现空白，浏览器F12 查看报错 就一个简单的页面，连个js文件都没引用，结果出现Uncaught SyntaxError: Unexpected token < 细究原因 服务器端，要是访问了一个不存在的文件【路径写错了】返回了一个404的提示页面 看看vue最后打包的index.html中的内容 <!DOCTYPE html><html> &...
SyntaxError: Unexpected token import
zyx的博客
07-10 2697
之前，为做一些NodeJS的一些相关测试，在 webstrom 工具写代码测试的时候，出现了一个问题，运行测试代码的时候，老是提示不支持 import 关键字。现象如下: 我创建了一个测试文件 assert.jsimport assert from "assert"; assert(1 === 2);12直接在 webstrom 中运行，然后就出现以下错误："F:\Program Files\Je...
React Native 最近 init一个新项目总是出这样的错：SyntaxError: Unexpected token import
GrapeLier的博客
07-10 3183
最近再用react-native编写一个项目作业，但是问题就这样出现了。当我开开心心打开我的项目时我的服务器闪退，react-active run-android时出现报红，百度了很多都说node升级就行了，然后重新注入依赖之类的，于是我由node 6.9.1升级为node8.11.3 最后就非常悲剧了，再init项目时就直接半路中断报错。最后各种卸载下载node，npm。折腾了大概6天发展为直接...
[js error] SyntaxError: Unexpected token ‘{‘ (at uniFile.js?t=1710138723630:1:34)
JiuMeilove的博客
03-11 570
[js error] SyntaxError: Unexpected token '{' (at uniFile.js?t=1710138723630:1:34)
SyntaxError: Unexpected token '{' in xxx\layout\layout.ejs while compiling ejs -hexo
LordYao的专栏
04-19 1360
Problem： PS D:\PortableGit\hexo> hexo g INFO Start processing ERROR Process failed: layout/layout.ejs SyntaxError: Unexpected token '{' in D:\PortableGit\hexo\themes\scholar-future\layout\layo...
报错Uncaught SyntaxError: Unexpected token {
shaleilei的博客
04-03 9419
我的这个报错是JS中的报错，然后提示的是语法的错误，然后爬了很多坑，最后发现是ES6和ES5的问题，这里面我分享下：    我们常见的引入JS文件都是像下面的方式：                但是实际上就是这个问题引起的，我们需要添加ES6的 属性，告诉浏览器这是一个ES6的模块                       使用ES6引入js文件的时候，script 中要添加type="mod...
npm报错SyntaxError: Unexpected token ＇.‘
leese233的博客
11-13 1万+
npm报错SyntaxError: Unexpected token ＇.'
SyntaxError: Unexpected token ‘{‘ in /*.jsp
嘻哈熊的专栏
09-29 1093
报错如下： 说是找不到对应的资源文件，详细排查了代码，发现我引入的文件有问题，只引入了文件名称，没有引入相对路径。 修复后结果如下图： 就算是在同一个文件，也不能直接用文件名引用，被IDEA影响了，IDEA可以直接跳转过去，但是自测是找不到这个文件的。 ...
Vue-cil创建项目报错SyntaxError: Unexpected token ‘.‘
qq_68066313的博客
02-01 760
我升级了一下我的vue-cil版本，以及npm镜像源（原淘宝npm域名（https://registry.npm.taobao.org）即将停止解析）更新npm镜像源npm config set registry http://registry.npmmirror.com。可能你遇到的问题原因和我不是一个问题，但是在创建项目时报错，并不难解决，最粗鲁的方式就将所有东西按照网上教程弄一遍。由于刚刚换了电脑，用vue-cil创建项目时发生了报错。OKOK祝大家永远没有BUG。
vue项目 Uncaught SyntaxError: Unexpected token .
最新发布
03-25
### Vue 项目修复 `Uncaught SyntaxError: Unexpected token .` 的解决方案 #### 问题分析 该错误通常发生在某些旧版浏览器无法解析现代 JavaScript 特性的情况下。例如，可选链操作符 (`?.`) 和空值合并运算符 (`??`) 是 ES2020 中引入的新特性，在较早版本的浏览器中可能不被支持[^4]。 为了使 Vue 项目能够兼容更多浏览器并避免此类错误，可以通过调整 Babel 配置来转译这些新语法为更广泛的浏览器可以理解的形式。 --- #### 解决方案 ##### 方法一：修改 Babel 插件配置 在项目的根目录下找到或创建 `babel.config.js` 文件，并添加以下插件： ```javascript module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins: [ '@babel/plugin-proposal-optional-chaining', '@babel/plugin-proposal-nullish-coalescing-operator' ] }; ``` 上述代码通过启用两个 Babel 插件将现代 JavaScript 新增的操作符转换成传统形式，从而提高兼容性。 --- ##### 方法二：更新 browserslist 设置 确保 `package.json` 文件中的 `browserslist` 字段已正确定义目标浏览器范围。以下是推荐设置的一个例子： ```json "browserslist": [ "> 1%", "last 2 versions", "not dead", "not ie 11" ] ``` 此列表表示覆盖全球至少 1% 用户使用的最新两代主流浏览器，排除不再维护的老化浏览器以及 IE11[^2]。如果需要进一步扩展到更低版本（如 IE），则需特别测试其对所需功能的支持程度。 --- ##### 方法三：验证资源加载路径 确认所有外部脚本均正常加载无误。有时因网络请求失败或者服务器返回 HTML 而非预期 JS 数据也会引发类似的句法异常提示[^3]。因此建议审查控制台日志查看是否有其他关联警告信息存在。 --- ##### 方法四：清理缓存重新构建 执行如下命令清除本地依赖项后再安装一次新的环境变量以保证一致性: ```bash rm -rf node_modules/ npm install npm run build ``` 这一步骤有助于消除由于包管理器残留数据引起的各种潜在冲突状况. --- ### 总结 综合以上措施应该能有效缓解甚至彻底解决由老旧设备触发的 “Unexpected token.” 类型的问题。不过需要注意的是,尽管我们尽可能扩大适配面但仍不可能满足每一个极端情况下的需求；所以在实际部署前最好针对主要受众群体做充分调研决定最终策略方向。 ---
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

King's Blog

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

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

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

打赏作者

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

抵扣说明：

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

余额充值