babel-plugin-transform-define

To help you get started, we've collected the most common ways that babel-plugin-transform-define is being used within popular public projects.

NervJS / taro / packages / taro-cli / src / rn / transformJS.ts View on Github

}
      }
    }
  })
  try {
    const constantsReplaceList = Object.assign({
      'process.env.TARO_ENV': BUILD_TYPES.RN
    }, Util.generateEnvList(projectConfig.env || {}), Util.generateConstantsList(projectConfig.defineConstants || {}))
    // TODO 使用 babel-plugin-transform-jsx-to-stylesheet 处理 JSX 里面样式的处理，删除无效的样式引入待优化

    const plugins = [
      [require('babel-plugin-transform-jsx-to-stylesheet'), {filePath}],
      require('babel-plugin-transform-class-properties'),
      require('babel-plugin-transform-decorators-legacy').default,
      [require('babel-plugin-danger-remove-unused-import'), {ignore: ['@tarojs/taro', 'react', 'react-native', 'nervjs']}],
      [require('babel-plugin-transform-define').default, constantsReplaceList]
    ]

    // const babelConfig = projectConfig.plugins.babel
    // const plugins = babelConfig.plugins.concat(extraBabelPlugins)
    const newBabelConfig = Object.assign({}, {plugins})

    ast = babel.transformFromAst(ast, code, newBabelConfig).ast
  } catch (e) {
    throw e
  }

  return {
    code: unescape(generate(ast).code.replace(/\\u/g, '%u')),
    styleFiles
  }
}

View more ways to use babel-plugin-transform-define

Compile time code replacement for babel similar to Webpack's DefinePlugin

Quick Start

$ npm install --save-dev babel-plugin-transform-define

.babelrc

{
  "plugins": [
    ["transform-define", {
      "process.env.NODE_ENV": "production",
      "typeof window": "object"
    }]
  ]
}

.babelrc.js

// E.g., any dynamic logic with JS, environment variables, etc.
const overrides = require("./another-path.js");

module.exports = {
  plugins: [
    ["transform-define", {
      "process.env.NODE_ENV": "production",
      "typeof window": "object",
      ...overrides
    }]
  ]
};

Reference Documentation

babel-plugin-transform-define can transform certain types of code as a babel transformation.

Identifiers

.babelrc

{
  "plugins": [
    ["transform-define", {
      "VERSION": "1.0.0",
    }]
  ]
}

Source Code

VERSION;

window.__MY_COMPANY__ = {
  version: VERSION
};

Output Code

"1.0.0";

window.__MY_COMPANY__ = {
  version: "1.0.0"
};

Member Expressions

.babelrc

{
  "plugins": [
    ["transform-define", {
      "process.env.NODE_ENV": "production"
    }]
  ]
}

Source Code

if (process.env.NODE_ENV === "production") {
  console.log(true);
}

Output Code

if (true) {
  console.log(true);
}

Unary Expressions

.babelrc

{
  "plugins": [
    ["transform-define", {
      "typeof window": "object"
    }]
  ]
}

Source Code

typeof window;
typeof window === "object";

Output Code

'object';
true;

License

MIT License

Maintenance Status

Stable: Formidable is not planning to develop any new features for this project. We are still responding to bug reports and security concerns. We are still welcoming PRs for this project, but PRs that include new features should be small and easy to integrate and should not include breaking changes.