Question

输入文件

import Logger from "logger";
export default class Greeter {
    constructor(name) {
        this.name = name || '';
        console.log('Hello', name);
    }

    notify() {
        console.log('It is my duty to inform you that this JS is ES6!');
    }

    getName() {
        Logger.log('Called getName');

        return this.name;
    }
}

输出文件，通过grunt

define([], function () {
    define(['exports', 'logger'], function (exports, _logger) {
        'use strict';

        Object.defineProperty(exports, "__esModule", {
            value: true
        });

        var _logger2 = _interopRequireDefault(_logger);

        function _interopRequireDefault(obj) {
            return obj && obj.__esModule ? obj : {
                default: obj
            };
        }

        function _classCallCheck(instance, Constructor) {
            if (!(instance instanceof Constructor)) {
                throw new TypeError("Cannot call a class as a function");
            }
        }

        var _createClass = function () {
            function defineProperties(target, props) {
                for (var i = 0; i < props.length; i++) {
                    var descriptor = props[i];
                    descriptor.enumerable = descriptor.enumerable || false;
                    descriptor.configurable = true;
                    if ("value" in descriptor) descriptor.writable = true;
                    Object.defineProperty(target, descriptor.key, descriptor);
                }
            }

            return function (Constructor, protoProps, staticProps) {
                if (protoProps) defineProperties(Constructor.prototype, protoProps);
                if (staticProps) defineProperties(Constructor, staticProps);
                return Constructor;
            };
        }();

        var Greeter = function () {
            function Greeter(name) {
                _classCallCheck(this, Greeter);

                this.name = name || '';
                console.log('Hello', name);
            }

            _createClass(Greeter, [{
                key: 'notify',
                value: function notify() {
                    console.log('It is my duty to inform you that this JS is ES6!');
                }
            }, {
                key: 'getName',
                value: function getName() {
                    _logger2.default.log('Called getName');

                    return this.name;
                }
            }]);

            return Greeter;
        }();

        exports.default = Greeter;
    });
});

输出文件，通过CLI

define(['exports', 'logger'], function (exports, _logger) {
    'use strict';

    Object.defineProperty(exports, "__esModule", {
        value: true
    });

    var _logger2 = _interopRequireDefault(_logger);

    function _interopRequireDefault(obj) {
        return obj && obj.__esModule ? obj : {
            default: obj
        };
    }

    function _classCallCheck(instance, Constructor) {
        if (!(instance instanceof Constructor)) {
            throw new TypeError("Cannot call a class as a function");
        }
    }

    var _createClass = function () {
        function defineProperties(target, props) {
            for (var i = 0; i < props.length; i++) {
                var descriptor = props[i];
                descriptor.enumerable = descriptor.enumerable || false;
                descriptor.configurable = true;
                if ("value" in descriptor) descriptor.writable = true;
                Object.defineProperty(target, descriptor.key, descriptor);
            }
        }

        return function (Constructor, protoProps, staticProps) {
            if (protoProps) defineProperties(Constructor.prototype, protoProps);
            if (staticProps) defineProperties(Constructor, staticProps);
            return Constructor;
        };
    }();

    var Greeter = function () {
        function Greeter(name) {
            _classCallCheck(this, Greeter);

            this.name = name || '';
            console.log('Hello', name);
        }

        _createClass(Greeter, [{
            key: 'notify',
            value: function notify() {
                console.log('It is my duty to inform you that this JS is ES6!');
            }
        }, {
            key: 'getName',
            value: function getName() {
                _logger2.default.log('Called getName');

                return this.name;
            }
        }]);

        return Greeter;
    }();

    exports.default = Greeter;
});

.babelrc

{
    "presets": ["es2015"],
    "plugins": ["transform-es2015-modules-amd"]
}

我正在遇到这种奇怪的行为，当我通过grunt-babel插件进行转换时，我的ES5源会添加额外的define()。我已经将repo和babel-core和babel-preset-es2015更新到了最新版本，并没有帮助。

挖掘到babel-grunt，看起来babel.transformFileSync用于进行转换。在babel-cli包中，使用了babel.tranform。但是babel.transformFileSync只是读取文件并将内容传递给babel.tranform。

我觉得我错过了一些小配置选项或某些地方的东西。谁能看到我错过的东西？

Answer 1

我发现了我的问题。在我的/I"$(JAVA_HOME)\include" /I"$(JAVA_HOME)\include\win32"中，我正在阅读并将我的Gruntfile.js文件中的JSON字符串传递给options对象。这似乎导致了双重定义。一旦我删除了该问题就解决了。

不确定为什么会导致这种行为，但现在已经处理好了。

通过grunt-babel额外定义transform-es2015-modules-amd

1 个答案: