babel 构建缺少要求

Question

我刚刚升级到 babelv7并且building我的项目我看到它只构建我的index.js而不是该文件中使用的任何导入。

我希望构建包含所有导入，以便我可以使用我构建的文件。

.babelrc

{

  "presets": [

    [

      "@babel/preset-env", {

      "targets": {

        "node": "current"

      }

    }]

  ]

}

索引.js

import FetchApi from './utils/fetch'

export const aFunc = function () {FetchApi()}    

export default aFunc

构建.js

"use strict";

Object.defineProperty(exports, "__esModule", {

  value: true

});

exports.default = exports.aFunc = void 0;

var _fetch = _interopRequireDefault(require("./utils/fetch"));

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

const aFunc = function () {

  (0, _fetch.default)();

};

exports.aFunc = aFunc;

var _default = aFunc;

exports.default = _default;

有问题的行在这里：   var _fetch = _interopRequireDefault(require("./utils/fetch"));

Answer 1

babel <src-file>只会转译单个源文件。您可以通过指定目录而不是单个源文件来转译目录中的所有源babel <src-dir> -d build文件： .&nbsp;这将生成一个转译文件树，并且您的 require 语句将解析为转译模块。如果你想将所有源文件合并到一个输出文件中，还有 babel 的--out-file标志，但它可能不会做你想要的（它只是cat将所有已转换的文件合并到一个输出文件中；你的 require 语句仍然存在，仍将指向外部文件，并会在运行时失败）。您可能需要像 webpack/rollup/parcel 这样的打包器来将 require 语句转换为内联模块，从而允许您生成一个独立的、转译的构建工件。