如何使用 webpack 导入整个 js 文件？

Question

我想在我的文件 index.js 中导入我的文件 functions.js，并在 functions.js 中使用变量和函数。

例如：我的文件 functions.js 中有一个变量 x。 我像“import './functions.js';”一样导入functions.js 在我的 index.js 中。 路径肯定是正确的（它们在同一个目录中）。 但是当我尝试使用 x 时，我遇到了下一个错误 ->“index.js:01 Uncaught ReferenceError: x is not defined”

函数export var x = 0;

index.js

import './functions.js';
console.log(x);

谢谢： ：）

Answer 1

模块的意义在于摆脱在单个 scope（全局 scope，默认情况下在非模块脚本中）中共享所有内容的业务。 如果你想这样做，不要使用模块，使用非模块脚本。

模块定义为

• 他们提供什么（ export ）
• 他们的期望（ import ）

一般来说，你最好明确这些关系：

import { x } from "./fonctions.js";
// ...use `x`...

假设x是一个命名的 export ：

export const x = /*...*/;
// or
export function x() {
    // ...
};
// etc.

JavaScript 模块中最接近“从 X 导入所有内容”构造的是模块命名空间 object导入，如下所示：

import * as fonctions from "./fonctions.js";

然后，您将使用fonctions.x来引用x 。 但是， x仍然必须从fonctions.js中导出（如上）。 在模块中声明的任何未显式导出的内容都是该模块私有的，因此它不会显示在模块命名空间 object 中。