2 

export { test };

const test = (str) => {
    return str;
};


import { test } from './func';

describe('func', () => {
    describe('func', () => {
        it('should return the same string', () => {
            expect(test('hello world')).to.equal('hello world');
        });
    });
});

我想，由于提升，test-function 是未定义的。因为如果我这样做：

const test = (str) => {
    return str;
};

export { test };

测试有效。

但是，我想将我的导出保留在文件顶部以便于参考。

有什么方法可以实现吗？

我的 karma.conf.js：

const webpackConfig = require('./webpack.config');
const fileGlob = 'src/**/*.test.js';

module.exports = (config) => {
    config.set({
        basePath: '',
        frameworks: ['mocha', 'chai'],
        files: [fileGlob],
        preprocessors: {
            [fileGlob]: ['webpack']
        },
        webpack: webpackConfig,
        webpackMiddleware: {noInfo: true},
        reporters: ['progress', 'mocha'],
        port: 9876,
        colors: true,
        logLevel: config.LOG_INFO,
        autoWatch: false,
        browsers: ['Firefox'],
        singleRun: true,
        concurrency: Infinity,
    });
};

以及 package.json 的相关部分：

"devDependencies": {
    "webpack": "^3.5.5",

    "babel-core": "^6.26.0",

    "babel-loader": "^7.1.2",
    "babel-plugin-add-module-exports": "^0.2.1",
    "babel-preset-es2015": "^6.24.1",

    "chai": "^4.1.1",
    "mocha": "^3.5.0",
    "karma": "^1.7.0",
    "karma-chai": "^0.1.0",
    "karma-mocha": "^1.3.0",

    "karma-webpack": "^2.0.4",

  },
4

1 回答 1

4

ES 模块导入反映了模块导出的状态。尽管const声明没有被提升，但在export { test }评估时处于临时死区，但在导入模块时导出已经反映了test实际值。

该问题可能是由模块转译引起的不正确行为引起的。Babel没有正确实现模块导出，这会导致undefined导出。

从这里可以看出（在支持 ES 模块的浏览器中可用，即最新的 Chrome），模块导出按本机预期工作。

TypeScript也按预期处理导出。

为了使代码与现有实现兼容，它应该是：

export const test = (str) => {
    return str;
};

或者：

const test = (str) => {
    return str;
};

export { test };

两者都是传统的出口方式，特别是因为这个问题。模块末尾的导出符合使用 CommonJS 模块产生的编码习惯。

于 2017-08-24T15:43:59.867 回答