index.js

'use strict';

module.exports = function(api, opts) {
  const env = process.env.BABEL_ENV || process.env.NODE_ENV;
  let isEnvDevelopment = env === 'development';
  const isEnvProduction = env === 'production';
  const isEnvTest = env === 'test';

  if (!isEnvDevelopment && !isEnvProduction && !isEnvTest) {
    throw new Error(
      'Using `babel-preset-sofa-react` requires that you specify `NODE_ENV` or ' +
        '`BABEL_ENV` environment variables. Valid values are "development", ' +
        '"test", and "production". Instead, received: ' +
        JSON.stringify(env) +
        '.'
    );
  }

  const testPresets = [
    [
      require('@babel/preset-env').default,
      {
        targets: {
          node: 'current',
        },
      },
    ], [
      require('@babel/preset-react').default,
      {
        development: true,
        useBuiltIns: true,
      },
    ]
  ]

  const productionPresets = [
    require('@babel/preset-env').default,
    {
      targets: {
        ie: 9,
      },
      ignoreBrowserslistConfig: true,
      useBuiltIns: false,
      modules: false,
      exclude: ['transform-typeof-symbol'],
    },
  ]

  return {
    presets: [
      isEnvTest && [
        // ES features necessary for user's Node version
        require('@babel/preset-env').default,
        {
          targets: {
            node: 'current',
          },
        },
      ],
      (isEnvProduction || isEnvDevelopment) && [
        // Latest stable ECMAScript features
        require('@babel/preset-env').default,
        {
          // We want Create React App to be IE 9 compatible until React itself
          // no longer works with IE 9
          targets: {
            ie: 9,
          },
          // Users cannot override this behavior because this Babel
          // configuration is highly tuned for ES5 support
          ignoreBrowserslistConfig: true,
          // If users import all core-js they're probably not concerned with
          // bundle size. We shouldn't rely on magic to try and shrink it.
          useBuiltIns: false,
          // Do not transform modules to CJS
          modules: false,
          // Exclude transforms that make all code slower
          exclude: ['transform-typeof-symbol'],
        },
      ],
      [
        require('@babel/preset-react').default,
        {
          // Adds component stack to warning messages
          // Adds __self attribute to JSX which React will use for some warnings
          development: isEnvDevelopment || isEnvTest,
          // Will use the native built-in instead of trying to polyfill
          // behavior for any plugins that require one.
          useBuiltIns: true,
        },
      ],
    ].filter(Boolean),
    plugins: [
      // 不明白这个装饰器的插件跟哪个冲突了 非得放到第一个才OK；
      [
        require('@babel/plugin-proposal-decorators').default,
        {
          "legacy": true
        }
      ],
      // Experimental macros support. Will be documented after it's had some time
      // in the wild.
      require('babel-plugin-macros'),
      // function foo(one: any, two: number, three?): string {}
      require('@babel/plugin-transform-flow-strip-types').default,
      // let {x, y} = obj;
      // let [a, b, ...rest] = arr;
      require('@babel/plugin-transform-destructuring').default,
      // class { handleClick = () => { } }
      // Enable loose mode to use assignment instead of defineProperty
      [
        require('@babel/plugin-proposal-class-properties').default,
        {
          loose: true,
        },
      ],
      // The following two plugins use Object.assign directly, instead of Babel's
      // extends helper. Note that this assumes `Object.assign` is available.
      // { ...todo, completed: true }
      [
        require('@babel/plugin-proposal-object-rest-spread').default,
        {
          useBuiltIns: true,
        },
      ],
      // Polyfills the runtime needed for async/await, generators, and friends
      // https://babeljs.io/docs/en/babel-plugin-transform-runtime
      [
        require('@babel/plugin-transform-runtime').default,
        {
          corejs: false,
          // helpers: areHelpersEnabled,
          regenerator: true,
          // https://babeljs.io/docs/en/babel-plugin-transform-runtime#useesmodules
          // We should turn this on once the lowest version of Node LTS
          // supports ES Modules.
          useESModules: isEnvDevelopment || isEnvProduction,
          // Undocumented option that lets us encapsulate our runtime, ensuring
          // the correct version is used
          // https://github.com/babel/babel/blob/090c364a90fe73d36a30707fc612ce037bdbbb24/packages/babel-plugin-transform-runtime/src/index.js#L35-L42
          // absoluteRuntime: absoluteRuntimePath,
        },
      ],
      // Adds syntax support for import()
      require('@babel/plugin-syntax-dynamic-import').default,
      isEnvProduction && [
        // Remove PropTypes from production build
        require('babel-plugin-transform-react-remove-prop-types').default,
        {
          removeImport: true,
        },
      ],
      // Replaces the React.createElement function with one that is more optimized for production
      isEnvProduction && require('babel-plugin-transform-react-inline-elements').default,
      // Treat React JSX elements as value types and hoist them to the highest scope
      // 我有点无法感知这个的用意
      isEnvProduction && require('babel-plugin-transform-react-constant-elements').default,
      isEnvTest &&
        // Transform dynamic import to require
        require('babel-plugin-dynamic-import-node'),
    ].filter(Boolean),
  };
}