esModule的模块加载在普通html中使用

-

 

 add.js

const add = (x, y) => {
  return x + y;
}

export default add;

minus.js

const minus = (x, y) => {
  return x - y;
}

export default minus;

html

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
<script type="module">
  import add from './module/add.js';
  import minus from './module/minus.js';
  console.log(add(4, 5));
  console.log(minus(4, 5));
</script>
</body>
</html>
复制代码

必须在服务器上打开页面才能正常运行，否则fiel协议会报跨域

借用http-server在服务器上打开就会正常运行

npx http-server

 

 

-

posted @   古墩古墩  Views(242)  Comments(0)  Edit  收藏  举报
相关博文：
· webpack5用babel-loader将es6的js代码转换成es5
· vue项目集成mock.js
· Module加载的详细说明-保证你有所收获
· 使用 ES Module 的正确姿势
· [JS] ES Modules的运作原理
阅读排行：
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· Manus爆火，是硬核还是营销？
· 终于写完轮子一部分：tcp代理 了，记录一下
· 别再用vector＜bool＞了！Google高级工程师：这可能是STL最大的设计失误
· 单元测试从入门到精通
历史上的今天：
2019-06-04 对象数组，按照没想中特定的属性（按中文拼音）排序
点击右上角即可分享
微信分享提示