有關es6的模組化
阿新 • • 發佈:2020-08-11
假如有兩個檔案:app.js和config.js
app.js為主檔案要去引用config這個模組
以前學習node時使用的模組匯出:
需求:匯出三個成員,分別是 foo: bar f: function num: 10
exports.foo = 'bar'
exports.f = function () {
}
exports.num = 10
es6中的模組匯出
方法一
export const foo = 'bar'
export const f = function () {
}
export const num = 10
兩種可以混合使用
方法二
const foo = 'bar' const f = function () { } const num = 10 export { foo, f, num }
通過 export 匯出的成員必須通過解構賦值按需載入
或者通過import * as 變數名
的形式載入所有通過 export 關鍵字匯出的介面成員
通過 export default 載入匯出的成員必須通過 import 變數名 from '模組標識'
進行載入
export 和 export default 可以共存
import config from './config'
import { foo, num } from './config'
import * as config from './config'
import { foo } from './config'
預設匯出
config.js
// 相當於 module.exports = function () {}
export default function () {
console.log('fff')
}
app.js:
// 這種方式會去找被載入模組中通過 export default 匯出的成員
import defaultConfig from './config'
defaultConfig任意指定
最後通過模板字串將它們打印出來
console.log(
default: ${defaultConfig}, foo: ${foo}, all: ${allConfig})