标签：ES6 模块 js m1 m3 m2 import ES11 log
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ES6 模块化</title>
</head>
<body>
<script type="module">
//1. 通用的导入方式
//引入 m1.js 模块内容
// import * as m1 from "./src/js/m1.js";
// //引入 m2.js 模块内容
// import * as m2 from "./src/js/m2.js";
// //引入 m3.js
// import * as m3 from "./src/js/m3.js";
//2. 解构赋值形式
// import {school, teach} from "./src/js/m1.js";
// import {school as guigu, findJob} from "./src/js/m2.js";
// import {default as m3} from "./src/js/m3.js";
//3. 简便形式 针对默认暴露
// import m3 from "./src/js/m3.js";
// console.log(m3);
</script>
<script src="./src/js/app.js" type="module"></script>
</body>
</html>
m1.js
//分别暴露
export let school = '尚硅谷';
export function teach() {
console.log("我们可以教给你开发技能");
}
m2.js
//统一暴露
let school = '尚硅谷';
function findJob(){
console.log("我们可以帮助你找工作!!");
}
//
export {school, findJob};
m3.js
//默认暴露
export default {
school: 'ATGUIGU',
change: function(){
console.log("我们可以改变你!!");
}
}
app.js 外部文件引入
//入口文件
//模块引入
import * as m1 from "./m1.js";
import * as m2 from "./m2.js";
import * as m3 from "./m3.js";
// console.log(m1);
// console.log(m2);
// console.log(m3);
// m1.teach();
// m2.findJob();
// m3.default.change();
//修改背景颜色为粉色
import $ from 'jquery';// const $ = require("jquery");
$('body').css('background','pink');
标签：ES6,
模块,
js,
m1,
m3,
m2,
import,
ES11,
log
From： https://www.cnblogs.com/chuixulvcao/p/17197382.html