import模块失效

简介: import模块失效

一点浩然气,千里快哉风。——宋•苏轼

昨天公司实习生问我这个import为什么一直报错,他代码如下:

报错信息如下:

Uncaught SyntaxError: Cannot use import statement outside a module

实际上是因为script标签没有加type导致的

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <script type="module">
      import {ruben} from './js/module.js'
      console.log(ruben)
    </script>
  </body>
</html>

这样就可以了

可以看到正常输出

当然,我们使用export default也是一样的

let ruben =  "module"
export default ruben

在外部引用

<script type="module">
  import ruben from './js/module.js'
  console.log(ruben)
</script>

相关文章
|
10月前
|
Java 测试技术 API
Java RESTful中的PATCH请求:局部更新与资源修改
在RESTful架构中,PATCH请求是一种用于局部更新已有资源的操作。PATCH请求允许客户端将部分数据发送到服务器,以便对资源进行局部修改,而不必替换整个资源。本文将引导您深入了解Java中使用PATCH请求构建RESTful API,探讨其特点、实现方式、用例以及在实际应用中的优势。
|
7月前
|
PHP C语言 Python
import方法引入模块详解
import方法引入模块详解
|
10月前
|
Java 测试技术 API
Java RESTful中的DELETE请求:资源的删除与数据清除
在RESTful架构中,DELETE请求是一种用于删除已有资源的关键操作。DELETE请求允许客户端请求服务器删除指定的资源,以及与之关联的数据。本文将引导您深入了解Java中使用DELETE请求构建RESTful API,探讨其特点、实现方式、用例以及在实际应用中的优势。
|
11月前
|
XML 缓存 SpringCloudAlibaba
Spring注解导入:@Import使用及原理详解
`@Import` 是 Spring 基于 Java 注解配置的主要组成部分,`@Import` 注解提供了类似 `@Bean` 注解的功能,向Spring容器中注入bean,也对应实现了与Spring XML中的<import/>元素相同的功能
715 0
|
12月前
|
JSON 缓存 Serverless
23.从入门到精通:Python模块 import 语句 from … import 语句 from … import * 语句 深入模块 修改my_module的源代码
23.从入门到精通:Python模块 import 语句 from … import 语句 from … import * 语句 深入模块 修改my_module的源代码
|
JavaScript
vue3不在手动引入import {ref} from ‘vue‘ 等 也能照样运行项目(unplugin-auto-import)
vue3不在手动引入import {ref} from ‘vue‘ 等 也能照样运行项目(unplugin-auto-import)
526 0
|
缓存 JavaScript 前端开发
import...from... 和 require 如何找到模块位置?
昨天写了一篇文章,是关于 Vite 的,基于 Vite 从 0 到 1 启动一个 Vue2 项目,文章后面留下了几个问题是关于模块寻址问题,举个 Vue 项目里比较常用的 Vue 模块导入例子 import Vue from "vue"; 为什么不用写相对地址和绝对地址就能够导出 Vue 呢?似乎也没有配置路径?也没有配置映射,那么究竟 from "vue"; 对应的究竟是那个路径呢?
|
分布式计算 Java 关系型数据库
导入 Import--增量导入--Lastmodified 模式(附加数据)| 学习笔记
快速学习 导入 Import--增量导入--Lastmodified 模式(附加数据)
97 0
|
分布式计算 Hadoop 关系型数据库
导入 Import--增量导入--Append 模式 | 学习笔记
快速学习 导入 Import--增量导入--Append 模式
277 0
导入 Import--增量导入--Append 模式 | 学习笔记
|
Python
Python编程:importlib.import_module动态导入模块
Python编程:importlib.import_module动态导入模块
324 0

热门文章

最新文章