Javascript 没有名称的 ES6 导入

Javascript ES6 import without a name

我是 运行 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 {} 的语法。

现在,我分配给该文件的 bootstrap 变量在 app.js 中未使用,因为它仅用于需要该文件和我的 IDE 类型的“灰色”让我知道它未被使用。

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

我还没有把它放到一个合适的模块中,因为那样它会有自己的本地范围,我不确定如何使用所有插件等设置 Vue。如果有人有更好的建议,我是敞开心扉。

干杯。

要包含文件而不导入任何内容,您只需删除语句的 <name> from 部分:

import './bootstrap';

这将执行目标模块而不影响活动模块的范围,但它可能有side-effects例如声明全局变量或修改现有全局变量。


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

Import an entire module for side effects only, without importing anything. This runs the module's global code, but doesn't actually import any values.

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