没有名称的Javascript ES6导入[重复]

Posted 2023-02-22

【中文标题】没有名称的Javascript ES6导入[重复]

【英文标题】：Javascript ES6 import without a name [duplicate]

【发布时间】：2017-07-04 05:44:33

【问题描述】：

我正在运行 Webpack、Babel 和 Vue.js，我想拆分我的入口文件。目前我有一个 app.js 文件，它是我的应用程序的起点。

我有一些代码片段要放入bootstrap.js 文件中，我想将其包含在我的主要app.js 文件中，我可以有一个干净的文件来开始使用 Vue 并在其中添加组件我去的时候。

我想在我的bootstrap.js 文件中添加的一些示例：

import messagesNL from './translations/nl';

Vue.use(VeeValidate, 
  locale: 'nl',
  dictionary: 
    nl: 
      messages: messagesNL
    
  
);

window.Vue = Vue;

插件、全局配置等的设置非常多。我觉得这不是你的典型模块，我发现很难为这个文件创建一个类似结构的模块，所以我基本上在我的app.js 文件中使用它：

import bootstrap from './bootstrap';

不知道这是否可行，它似乎只是整齐地导入所有内容，而我没有完成类似 module exports 的语法。

现在，我分配给该文件的引导变量在 app.js 中未使用，因为它仅用于要求该文件，而我的 IDE 将其显示为“灰色”，让我知道它未使用。

是否有另一种语法，这样我就不必为它分配名称？这种方法可以拆分我的文件，还是我应该做其他事情？

我还没有把它放到合适的模块中，因为那样它就会有自己的本地范围，我不确定如何使用所有插件等设置 Vue。如果有人有更好的建议，我愿意它。

干杯。

【参考方案1】：

要在不导入任何内容的情况下包含文件，您只需删除语句的 <name> from 部分：

import './bootstrap';

这将执行目标模块而不影响活动模块的范围，但它可能会产生副作用，例如声明全局变量或修改现有全局变量。

---

如 Import a module for its side effects only 的 MDN 文档中所述：

导入整个模块仅用于副作用，不导入任何内容。这会运行模块的全局代码，但实际上并不导入任何值。

import '/modules/my-module.js';

【讨论】：

这是否等同于require('bootstrap');？

@Anonymous 是的，它相当于一个独立的 require 语句（调用 require 的结果没有分配给任何东西）。但是，根据问题，您示例中的路径不正确。应该是require('./bootstrap')。

正确的说法是您导入此模块仅是为了它的副作用。 developer.mozilla.org/en-US/docs/Web/javascript/Reference/…

“只有副作用”是什么意思？如果你导入 Bootstrap 或 jQuery 之类的，import '../../assets/jQuery/jquery-3.6.0.js，是不是在全球范围内不可用？