动态导入的工作方式与常规导入不同

Question

我在../../src/routes/index.js:中有这个文件

import Router from '../../my_modules/nexus/Router.js'
Router.get('/', function (request, response) {
response.send('welcome home')
})
Router.get('/about', function (request, response) {
response.send('about me')
})

我试图通过节点导入这个文件，因为我想创建自己的简单路由API类。

以下是我正在尝试使用的代码：

import express from 'express'
import Router from './Router.js'
const app = express()
import '../../src/routes/index.js'
// import('../../src/routes/index.js')
console.log(Router.routes)
app.listen(3000, function () {
console.log(`App listening on http://localhost:3000`)
})

这项工作：

import '../../src/routes/index.js'
// console.log(Router.routes) has the routes!

这不起作用：

import('../../src/routes/index.js')
// console.log(Router.routes) is empty!

我需要第二个例子来工作，因为我想从routes目录中动态导入一堆文件。如何使用import()语法实现此功能？

Answer 1

动态导入返回一个Promise，在运行依赖于导入模块的任何代码之前，您需要等待它(在async函数中使用await或通过调用then(。

import express from 'express'
import Router from './Router.js'
const app = express()
import('../../src/routes/index.js').then(function () {
console.log(Router.routes)
app.listen(3000, function () {
console.log(`App listening on http://localhost:3000`)
})
});