Vue2运行报错SyntaxError: Cannot use import statement outside a module

已于 2023-06-05 09:28:35 修改
阅读量2.3k 收藏 2
点赞数 1
分类专栏： 不想看见Bug vue 文章标签： vue.js 前端 javascript webpack
于 2023-03-31 10:41:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42373175/article/details/129874279
版权

问题描述

像配置vue3那样配置vue.config.js的路径代理@代替src后，报错。“语法错误：不能在模块外部使用导入语句”。

原因

模块语法一个是CommonJS module，一个是 ES6 module。vue.config.js里的module.exports是CommonJS module语法。所以不能使用ES6的语法import来引入模块。而是要遵循CommonJS module语法的require来引入模块。

解决

改成CommonJS module的语法用require引入。

小五Five
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
Vue项目报错：Uncaught SyntaxError: Unexpected token
01-19
遇到问题： 今天做一个 VUE 的项目，在引入第三方依赖的 JS 文件时，遇到了一个问题： 控制台的提示：Uncaught SyntaxError: Unexpected token < 按照提示进入文件，再看如下图： 仔细看了看 index.html 文件,发现原本我的 JS 文件是放在 /src/utils 文件夹下的，但引入 /src 和 /static 的文件是有区别的。 解决方案： 解决办法是将第三方依赖的 JS 文件放到 /static/utils 目录下，引入路径也改成：[removed][removed]，这样就
报错：Uncaught SyntaxError: Cannot use import statement outside a module 详解
01-07
JS错误Uncaught SyntaxError: Cannot use import statement outside a module< 分析及解决方法 错误信息： 错误分析： HTML 网页中，浏览器通过 script 标签加载 JavaScript 脚本。由于浏览器脚本的默认语言是 JavaScript，因此type=”application/javascript”可以省略。在报错中了解到，是说无法在模块外部使用import语句，因为Module 的加载实现的是es6语法，所以在浏览器加载html文件时，需要在script 标签中加入type=”module”属性。 解决办法：
electron-vue中报错 Cannot use import statement outside a module解决方案(亲测有效！！！)
DLGDark的博客
12-07 9995
错误： Cannot use import statement outside a module(不能在模块之外使用导入语句)。原因： 安装的某个依赖包里使用了import语法，因为我们打包输出的是commonjs规范，所以不识别import语法而导致报错。可以从 .electron-vue/webpack.renderer.config.js目录文件中看到如下一段代码：上面图示中代码就可以看出打包输出的目标文件为commonjs规范，对es2015规范中import语法不识别。解决方案： 使用webpac
【解决SyntaxError: Cannot use import statement outside a module问题】
最新发布
qq_55873376的博客
05-16 596
报错原因：这个错误通常是因为你正在尝试在一个不支持 ES6 模块语法的环境中使用 import 语句。这可能是因为你的代码是在一个只支持 CommonJS 或 AMD 模块系统的环境中运行的，或者你的代码运行的环境没有正确配置以支持 ES6 模块。如果是在浏览器环境，浏览器对这种语法支持的不是很好，解决方法是配置webpack。执行上述命令后出现如下错误。
Vue 2项报错 import “********“； ^^^^^^ SyntaxError: Cannot use import statem
只会helloworld的小白啊的博客
03-28 316
但实际错误并不是这样，GPT问了好一会后，选择走百度，在简书上找到了。看说明是报错的不支持 ES 6 import 语句。这个故事告诉我 不要盲目的gpt。
vue运行报错：SyntaxError: Cannot use import statement outside a module
祈澈菇凉
12-29 1万+
PS C:\Users\wangting\Desktop\assets_web_admin\assets_web_admin> npm run dev > vue-element-admin@4.2.1 dev C:\Users\wangting\Desktop\assets_web_admin\assets_web_admin > vue-cli-service s...
解决vue：import axios 报错 Uncaught SyntaxError: Cannot use import statement outside a module
weixin_43424730的博客
04-02 4860
import axios from "axios"; beforeCreate: { renew: function () { axios.post('/renew/', {}) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }) .then(func
vue的nuxtjs报错 Cannot use import statement outside a module
xiexikk的博客
06-28 2702
项目场景： 因nuxt项目需要安装a基础库包，故需引用到a包的一些方法，从而import的时候报错了。 问题描述： 如我们import fn from “a”， 拿a包的fn方法时，报的错误：Cannot use import statement outside a module 解决方案： nuxt官网说明：https://zh.nuxtjs.org/docs/2.x/directory-structure/plugins 在nuxt.config.js配置中，build中加入transpile，如下：
SyntaxError: Cannot use import statement outside a module
weixin_43094085的博客
03-15 1万+
转载原文地址 https://www.dvy.com.cn/2021/01/24/7021.html SyntaxError: Cannot use import statement outside a module报错原因和解决方法 这提示一般是node下无法使用import。 node编程中最重要的思想之一就是模块，而正是这个思想，让JavaScript的大规模工程成为可能。 模块化编程在js界流行，也是基于此，随后在浏览器端，requirejs和seajs之类的工具包也出现了，可以说在对应规范下，.
Vue项目报错：Uncaught SyntaxError: Unexpected token <
10-17
主要介绍了Vue项目报错：Uncaught SyntaxError: Unexpected token <，在引入第三方依赖的 JS 文件时，遇到的一个问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
【报错问题】Vue 运行时提示 Error: Cannot find module ‘chalk’
01-07
运行 'npm run build' 时，提示错误 Error: Cannot find module 'chalk' 三、解决办法 3.1、根据上诉提示，其实已经告诉了问题来源，本地没有 node_modules 包，需要先运行命令 npm install 进行安装 npm install...
vue-cli 打包后提交到线上出现 “Uncaught SyntaxError:Unexpected token” 报错
01-21
前言: 项目使用vue-cli版本2.9.3 ,vue-router使用webpackChunkName实现按需加载. BUG描述:该报错在项目上线一段时间后,有用户反映页面无法正常游览 (后面以问题1/问题2区分) 问题1.导航点击无法正常跳转,console...
vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错
10-17
主要介绍了vue-cli 打包后提交到线上出现 "Uncaught SyntaxError:Unexpected token" 报错，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
浏览器中如何使用 module export import: Uncaught SyntaxError: Cannot use import statement outside a module 问题
06-09 1132
我在 html 页面中引入了 vue 出现这样的错误提示是因为，你在 html 引入的 js 中使用了 import 语法，而默认情况下，浏览器是不识别这个的，比如在 html 页面中直接引入 vue 进行使用，其中 vue 的 js 文件里又引入了外部的一些 js。在 script 标签中添加 即可 这样就能正常使用了...
【Debug】解决SyntaxError: Cannot use import statement outside a module问题
一种简单易食的杂烩????
02-12 873
【代码】【Debug】解决SyntaxError: Cannot use import statement outside a module问题。
JS报错：Cannot use import statement outside a module
热门推荐
闫振兴的博客
12-13 3万+
解决办法： 增加：<script type="module">中增加type的类型是module； demo1.js export var name = "yzxing"; export let age = "26"; export function person(name, age) { this.name = name; this.age = age; return `${this.name} ++++ ${this.age}` } html： &l
vue报错SyntaxError: Cannot use import statement outside a module
09-19
引用中提到了一个可能导致Vue项目报错"SyntaxError: Cannot use import statement outside a module"的问题。这个错误通常发生在引入第三方依赖的JS文件时。解决这个问题的方法是，在HTML文件的head中插入`<script src="https://unpkg.com/axios/dist/axios.min.js"></script>`，而不是使用`import`语句。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值