模块化
模块化是指将一个大的程序文件,拆分成许多小的文件,然后将小文件组合起来。
index.htm;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="shortcut icon" href="#" />
<title>Title</title>
</head>
<body>
<script type="module">
import * as m from "./m.js";
console.log(m);
</script>
</body>
</html>
m.js
let school = '学校';
function teach () {
console.log('我可以教你学习');
}
export { school, teach };
默认暴露
index.html
import * as d from './default.js';
console.log(d.default.school);
default.js
export default {
school: '学校',
teach: function () {
console.log('我可以教你');
}
};
导入模块
- 通用导入方式:import 别名 文件路径
- 解构赋值形式
import { school, teach } from './m.js';
teach();
import { default as m3 } from './default.js';
m3.teach()
此处 default 必须加个别名,不能使用 default 关键字
- 简便形式,只针对默认暴露
import m3 from 'm.js'
m3.school;
引入模块的简便形式
app.js
import {school, teach} from 'm1.js';
import m2 from 'default.js'
console.log(school);
teach();
m2.teach();
index.html
<script src='./app.js' type='module'></script>
更多精彩内容:各种AI课程、技能课程、黑科技软件、网站小程序源码、副业小项目、PPT模板等精品素材、电商课程、推广引流课程等,尽在 天边资源网 。