html页面报错Uncaught SyntaxError: Cannot use import statement outside a module

小咪咪 2023-06-25 03:05 107阅读 0赞

如题所示，在我们学习es6的时候，使用export导出模块，使用import导入模块的语法时，我们需要将我们在html中声明的标签<script></script>类型type指定为module，简单代码如下：
 a.js
 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZlaW5pZmk_size_16_color_FFFFFF_t_70][]
index.html
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZlaW5pZmk_size_16_color_FFFFFF_t_70 1][]
在浏览器中打开页面，查看控制台，会报如题所示的错误：
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZlaW5pZmk_size_16_color_FFFFFF_t_70 2][] 
报错的原因是用了es6的语法， 浏览器默认将它作为js解析会出现问题，需要将它作为模块导入，因此，我们需要将<script type="text/javascript"></script>修改为<script type="module"></script>，修改之后就会出现正确的结果：
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2ZlaW5pZmk_size_16_color_FFFFFF_t_70 3][]

发表评论取消回复

表情：

评论列表（有 0 条评论，107人围观）

还没有评论，来说两句吧...

相关阅读

相关 Cypress：报错Uncaught SyntaxError: Unexpected identifier 解决方案

时候可能因为被测web的原因导致如下报错： Uncaught SyntaxError: Unexpected identifier This ...

小咪咪/ 2024年04月17日 20:07/ 0 赞/ 160 阅读

相关 Vue报错“ Uncaught TypeError: Cannot read property ‘use‘ of undefined”

Vue报错“ Uncaught TypeError: Cannot read property ‘use‘ of undefined” 错误全程 Cannot re

Love The Way You Lie/ 2024年03月16日 13:37/ 0 赞/ 193 阅读

相关详细分析解决Uncaught SyntaxError: Cannot use import statement outside a module (at ...)的错误

文章目录 1. 复现错误 2. 分析错误 3. 解决错误 1. 复现错误今天在学习`es6`时，启动页面后，却报出如下图错误： ![在

不念不忘少年蓝@/ 2023年09月25日 15:43/ 0 赞/ 124 阅读

相关 js export import : Uncaught SyntaxError: Unexpected identifier

问题 ![20200408145753333.png][] 问题描述今天尝试使用ES6 import和export导入模块报以上错误原因以下为js文

深碍√TFBOYSˉ_/ 2023年07月24日 02:09/ 0 赞/ 119 阅读

相关 html页面报错Uncaught SyntaxError: Cannot use import statement outside a module

如题所示，在我们学习es6的时候，使用export导出模块，使用import导入模块的语法时，我们需要将我们在html中声明的标签<script></script>类型

小咪咪/ 2023年06月25日 03:05/ 0 赞/ 108 阅读

相关运行nodejs项目，npm start启动项目import报错，SyntaxError: Cannot use import statement outside a module

运行nodejs项目报错如下： $ npm start

比眉伴天荒/ 2023年06月17日 13:55/ 0 赞/ 87 阅读

相关 vue运行报错：SyntaxError: Cannot use import statement outside a module

![4f7a6168858950498b69198dc2cf5b7c.png][] PS C:\Users\wangting\Desktop\assets_web_a

左手的ㄟ右手/ 2022年12月31日 14:28/ 0 赞/ 664 阅读

相关 Uncaught SyntaxError: Cannot use import statement outside a module

1、错误描述 Uncaught SyntaxError: Cannot use import statement outside a module 2、错误原因

谁践踏了优雅/ 2022年11月24日 14:06/ 0 赞/ 202 阅读

相关 Uncaught SyntaxError: Illegal return statement(js报错)

<script> if(condition1){ return "string1"; }else if(condition2){

淩亂°似流年/ 2022年09月29日 04:25/ 0 赞/ 515 阅读

相关 react 报错You should not use xx outside a 「Router」

不能将使用了react-router-dom的组件暴露在BrowserRouter之外解决:将组件放在BrowserRouter内代码示例:

青旅半醒/ 2021年07月24日 12:11/ 0 赞/ 445 阅读