Question

我注意到，由于某种原因，Babel将我的代码转换为CommonJS而不是AMD。而且我认为由于这个原因，我收到了错误define cannot be used indirect。

这是我的输入代码：

define('app', [
    'lib/angular',
    'lib/has',
], function (angular, has) {
    'use strict';

    return angular.module('app', ['ngAnimate', 'ngSanitize', 'angular-require'])

}, function(error) {
    console.error(error);
});

这是输出文件：

!function (e) {
    var n = {};

    function r(t) {
        if (n[t]) return n[t].exports;
        var o = n[t] = {i: t, l: !1, exports: {}};
        return e[t].call(o.exports, o, o.exports, r), o.l = !0, o.exports
    }

    r.m = e, r.c = n, r.d = function (e, n, t) {
        r.o(e, n) || Object.defineProperty(e, n, {enumerable: !0, get: t})
    }, r.r = function (e) {
        "undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {value: "Module"}), Object.defineProperty(e, "__esModule", {value: !0})
    }, r.t = function (e, n) {
        if (1 & n && (e = r(e)), 8 & n) return e;
        if (4 & n && "object" == typeof e && e && e.__esModule) return e;
        var t = Object.create(null);
        if (r.r(t), Object.defineProperty(t, "default", {
            enumerable: !0,
            value: e
        }), 2 & n && "string" != typeof e) for (var o in e) r.d(t, o, function (n) {
            return e[n]
        }.bind(null, o));
        return t
    }, r.n = function (e) {
        var n = e && e.__esModule ? function () {
            return e.default
        } : function () {
            return e
        };
        return r.d(n, "a", n), n
    }, r.o = function (e, n) {
        return Object.prototype.hasOwnProperty.call(e, n)
    }, r.p = "", r(r.s = 0)
}([function (e, n, r) {
    var t;
    void 0 === (t = function () {
        "use strict";
        r(1)("app", ["lib/angular", "lib/has"], function (e, n) {
            return e.module("app", ["ngAnimate", "ngSanitize", "angular-require"])
        }, function (e) {
            console.error(e)
        })
    }.apply(n, [])) || (e.exports = t)
}, function (e, n) {
    e.exports = function () {
        throw new Error("define cannot be used indirect")
    }
}]);

还有我的webpack.config：

const path = require("path");

module.exports = {
    entry: {
        main: './app/js/app/main.js'
    },
    output: {
        path: path.resolve(__dirname, 'app/build'),
        filename: 'main.js'
    },
    module: {
        rules: [{
            test: /\.js?$/,
            exclude: [/node_modules/],
            loader: 'babel-loader',
            query: {
                presets: ['@babel/preset-env'],
                plugins: ["@babel/plugin-transform-modules-amd"]
            }
        }]
    }
};

为什么不正确地转译它？

Webpack Babel不输出为AMD

0 个答案: