# JavaScript使用export和import的两个报错如何解决

> 作者/来源: UCloud 运营管理员
> 发布时间: 2023-01-20T00:28:00.000Z
> 分类: 解决方案
> 标签: Java
> 原文链接: http://117.50.162.249:3000/yun/articles/613

---

# JavaScript使用export和import的两个报错如何解决

> 来源: https://www.ucloud.cn/yun/130288.html
> 作者: 3403771864
> 发布日期: 发布于2023-01-20 08:28

前言

　　本篇文章主要为大家叙述关于JavaScript中的export和import，这两个常见的报错。

　　报错：Uncaught SyntaxError: Cannot use import statement outside a module

![2022070716515454.png](https://ucloud-blog.cn-bj.ufileos.com/articles/130288/images/130288_000.png)

　　上面标书的是无法在module以外使用import，在网上进行查阅之后才了解到，这是由于script标签默认是使用JavaScript语言，使用ES6的语法会发生解析错误，需要在script标签中加入type=“module”，具体如下：

```
　　<script type="module">
　　import Rotation from '../js/ui.js'
　　Rotation();
　　</script>
```

　　仔细看，这样就不会出现报错吧。

　　报错：Uncaught SyntaxError: The requested module ‘…/js/ui.js’ does not provide an export named ‘default’

　　第一错误解决了，但随之而来的是控制台又抛出了第二个错误：

![2.png](https://ucloud-blog.cn-bj.ufileos.com/articles/130288/images/130288_001.png)

　　现在我来说说我的，目标JS文件中没有default导出，因此，我的JS文件就是这样：

```
　　function Rotation() {
　　let lbt = document.querySelectorAll('.zh-lbt');
　　for (let i = 0; i < lbt.length; i++) {
　　let lbtNum = Number(lbt[i].getAttribute('num'))||1
　　console.log(lbtNum);
　　}
　　}
　　export {Rotation};
```

　　常规来说没啥问题，export default和export只是暴露目标数有区别，因此不会是语法报错，是不是我的引入出现问题，随之做出下来改变

```
　　<script type="module">
　　import Rotation from '../js/ui.js'
　　Rotation();
　　</script>
```

　　加了一个大括号{}，修改为了

```
　　<script type="module">
　　import {Rotation} from '../js/ui.js'
　　Rotation();
　　</script>
```

　　发现果然控制台没有报错，并出现了结果

![3.png](https://ucloud-blog.cn-bj.ufileos.com/articles/130288/images/130288_002.png)

　　这个问题我认为其原因是export语法可以向外暴露多个目标，所以在引入时需要通过“{}”以对象经行引入，export default只能向外暴露一个，所以可以不用写{}。

　　可却不是。

　　在改为export default后，才发现export default在引入时，不能加{}，否则会报错。

```
　　export default{
　　Rotation:function () {
　　let lbt = document.querySelectorAll('.zh-lbt');
　　for (let i = 0; i < lbt.length; i++) {
　　let lbtNum = Number(lbt[i].getAttribute('num'))||1
　　console.log(lbtNum);
　　}
　　}
　　}
```

```
　　<script type="module">
　　import {Rotation} from '../js/ui.js'
　　Rotation.Rotation();
　　</script>
```

　　此时控制台会报错

![4.png](https://ucloud-blog.cn-bj.ufileos.com/articles/130288/images/130288_003.png)

　　同理此时只要去掉“{}”，就不会报错了，并能正确打印上面的结果。

      欢迎大家关注更多精彩内容！