ES6导入“模块”不授予“模块”功能

Question

我正在尝试将ES6 Imorts与babel和Node.js一起使用

import "./utils.js";

log("something"); //throw an error : log is not defined

我的utils.js看起来像这样：

function log(... params){
    console.log(... params);
}

log("module utils executed");
//Is executed and display "module utils executed" in the console.

我也尝试过使用export function log(... params)和export default log(... params)但是它不起作用。

所以我不明白这是怎么工作的...

编辑：

我知道另一种导入方法是import utils from "./utils.js"

但这不是我想要的。 我希望能够使用log()而不用模块变量名作为前缀。 喜欢这篇博客文章

Answer 1

有不同的ES6 import和Node.js require 问题描述差异

万一您将使用Node.js require ：

您的utils.js文件将是

function log(params) {
    console.log(params);
}

module.exports = {
   log
};

另一个文件将导入您的Utils模块

var utils = require('./utils');
utils.log("test");

如果您将使用ES6模块：

您的utils.js文件将是

var log = function (params) {
    console.log(params);
}

var utils = {
    log: log
}

export default utils;

另一个文件将导入您的Utils模块

import utils from 'utils';

utils.log("test");

更新

根据您的评论 ，可以，但是可以使用ES6模块

您的utils.js文件将是

function log(params) {
    console.log(params);
}

function anotherLog(params) {
    console.log(params);
}

export { log, anotherLog }

另一个文件将导入您的Utils模块

import { log } from 'utils';

log("test");

Answer 2

不，无法将模块的所有导出成员导入当前名称空间。 导入具有副作用的模块（即import 'utils' ）对utils的成员没有任何作用。

您可以得到的最接近的是这样的：

utils.js

export function log(...params) { ... }
export function foo(a) { ... }

main.js

import * as u from './utils';
u.log(1, 2, 3);
u.foo(4);

要么

import { log, foo } from './utils';
log(1, 2, 3);
foo(4);

ES6模块规范的设计目标之一是静态模块结构，该结构允许在编译时（执行任何操作之前）解析导入。 允许一揽子进口将使静态分析更加困难。

---

编辑 （ 请勿执行此操作！ ）

正如@Bergi在注释中指出的那样，您可以按如下所示将函数添加到全局名称空间：

utils.js

function log(...params) { ... }
global.log = log;

main.js

import './utils';  // import for side effects, add properties to the global object
log(1, 2, 3);      // the global object is in the scope chain, so this is resolved

但这是一个坏主意 。 全局变量的解析速度很慢，通常会破坏您首先使用模块来实现的模块化。