babel 转译代码使用绝对导入

Question

Transpiling code using @babel/cli with the following command:

babel --plugins @babel/plugin-transform-arrow-functions www/js/origin.js --out-file www/js/result.js

produces a file which require imports using absolute path from my computer. Of course, running that on the server breaks as path is not found.

Here is an example of absolute imports:

import _slicedToArray from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/slicedToArray";
import _createClass from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/createClass";
import _inherits from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/inherits";
import _possibleConstructorReturn from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/possibleConstructorReturn";
import _getPrototypeOf from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/getPrototypeOf";
import _classCallCheck from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/classCallCheck";
import _typeof from "/Users/myself/project/node_modules/@babel/runtime/helpers/builtin/es6/typeof";

Is there any way for the transpiled file to include everything it needs inline?

I don't use any specific babel.config.js or babelrc file at the moment.

Answer 1

As mentioned in the issue , the react-app preset has an option called absoluteRuntime which is set to true by default. So, try setting it as false as shown below.

 "presets": [
["react-app", { "absoluteRuntime": false }],]

The original answer was given by VasiliKubarka in that issue. I'm just reproducing here for the benefit of others.