javascript - Node + create-react-app + Express - 如何将函数导入 Express

Question

我正在使用在 Express 中运行的 socket.IO 在客户端之间分发数据。为了获取这些数据，我需要使用另一个文件中的函数。现在，如果我理解正确的话，Node + Express 本身并不支持导入/导出关键字，而我在应用程序的客户端(React)端使用这些关键字。因此，我在服务器文件中使用了“require”:

服务器.js

const initialStateFunctions  = require("../components/functions/InitialStateFunctions");
const playerStates = initialStateFunctions.getInitialPlayerStates();

InitialStateFunctions.js

import {shuffleArray} from "./CardManipulationFuntions";
import {ARTIFACTS, CARD_STATE, CARD_TYPE, GUARDIANS, ITEMS} from "../../data/cards";
import {GLOBAL_VARS} from "../../App";
import {LOCATION_LEVEL, LOCATION_STATE, LOCATIONS} from "../../data/locations";

/* INITIAL PLAYER STATE */
export function getInitialPlayerStates() {

但是现在 Express 由于以下错误而无法加载:

> lore_hunters@0.1.0 start C:\Projects\lore_hunters
> node src/server/server.js

C:\Projects\lore_hunters\src\components\functions\InitialStateFunctions.js:1
import {shuffleArray} from "./CardManipulationFuntions";
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:1063:16)
    at Module._compile (internal/modules/cjs/loader.js:1111:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1167:10)
    at Module.load (internal/modules/cjs/loader.js:996:32)
    at Function.Module._load (internal/modules/cjs/loader.js:896:14)
    at Module.require (internal/modules/cjs/loader.js:1036:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (C:\Projects\lore_hunters\src\server\server.js:11:32)
    at Module._compile (internal/modules/cjs/loader.js:1147:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1167:10)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! lore_hunters@0.1.0 start: `node src/server/server.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the lore_hunters@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

我想在 InitialStatesFunction 中保留使用导入/导出模块 - 那么我应该如何将 getInitialPlayerState 函数导入到 server.js 应用程序中？我需要以某种方式将 server.js 转换为模块吗？ (“不能在模块外部使用 import 语句”)

编辑:我知道 Node 本身并不使用 import 并且要使用 require 。问题是加载的模块返回了我在问题中列出的错误。

EDIT2:当对较新版本的 Node 使用 "type": "module"选项时，我可以重写 server.js 文件以使用导入而不是 require:

import express from "express";
import http from "http"
import socketIO from "socket.io"
import path from "path"
import {getInitialPlayerStates} from "../components/functions/InitialStateFunctions";

const port = process.env.PORT || 4001;
const app = express();
// server instance
const server = http.createServer(app);

const playerStates = getInitialPlayerStates();

但是这会出现以下错误:

(node:12816) ExperimentalWarning: The ESM module loader is experimental.
internal/modules/esm/resolve.js:61
  let url = moduleWrapResolve(specifier, parentURL);
            ^

Error: Cannot find module C:\Projects\lore_hunters\src\components\functions\InitialStateFunctions imported from C:\Projects\lore_hunters\src\server\server.js
    at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:61:13)
    at Loader.resolve (internal/modules/esm/loader.js:85:40)
    at Loader.getModuleJob (internal/modules/esm/loader.js:191:28)
    at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:42:40)
    at link (internal/modules/esm/module_job.js:41:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

输出中显示的路径似乎是正确的。文件夹结构如下:

编辑:似乎导入必须指定文件扩展名( https://medium.com/@nodejs/announcing-core-node-js-support-for-ecmascript-modules-c5d6dc29b663 ) - 这很容易修复，但是服务器出现 JSX 问题:

        effectsText: <Coin/>,
                     ^
SyntaxError: Unexpected token '<'

Answer 1

如果需要在node中使用es6模块，请在服务器项目的package.json中添加“type”:“module”。这样，所有 .js 和 .mjs 文件都被解释为 ES 模块。您可以使用 .cjs 扩展名将单个文件解释为 CommonJS。

编辑:请注意，不可能将导入与 require 混合使用 - 如果文件被识别为模块，则所有 require 都必须更改为导入。另外，必须指定文件扩展名，并且不能使用 __dirname - 请参阅 https://medium.com/@nodejs/announcing-core-node-js-support-for-ecmascript-modules-c5d6dc29b663 .