Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@skava/bs / src / .plugins / env.ts
Size: Mime:
import { EnvironmentPlugin, DefinePlugin } from 'webpack'
// import { config as di } from '@skava/di'
// import getConfigForEnv from '../oneConfig/getConfigForEnv'
import { Configuration, Options } from '../typings'

const THEME = process.env.THEME || 'wr' || 'classic'
const BUSINESS_RELATIONSHIP =
  process.env.BUSINESS_RELATIONSHIP || 'B2C' || 'B2B'
// @NOTE when this is Boolean(x) it messes up assets, so the env check for it is wrongs
const toBooleanJSON = x => JSON.stringify(Boolean(x))

/**
 * @todo bake in all .env values here... or at least in oneConfig
 *
 * @todo use DefinePlugin
 *
 * @tutorial https://webpack.js.org/plugins/environment-plugin/#usage-with-default-values
 * @tutorial https://webpack.js.org/plugins/define-plugin/
 */
export default function envPlugin(config: Configuration, options: Options) {
  const { isClient, isServer, isDev, isProd } = options

  const ENV_CONFIG = {
    // @NOTE should be in DefinePlugin

    // Is this the "client" bundle?
    BUILD_FLAG_IS_CLIENT: toBooleanJSON(isClient),
    // Is this the "server" bundle?
    BUILD_FLAG_IS_SERVER: toBooleanJSON(isServer),

    BUSINESS_RELATIONSHIP,
  }
  const DEFINE_CONFIG = {
    // __IS_BROWSER__:
    // __IS_SERVER__:
    // __VERSION__:
    // '__THEME_IMPORT__': `require("./${THEME}")`,
    __THEME_IMPORT__: `"./${THEME}"`,
    __DEV__: isDev,
    __PROD__: isProd,
    __PRODUCTION__: isProd,
    __THEME__: JSON.stringify(THEME),

    DEVTOOLS: false,
    INJECT_CLIENT: isDev,
  }

  /**
   * @example { API_URL: 'eh' } => { 'process.env.API_URL': 'eh' }
   * @todo this has some acorn issue which means something is doing some fancy check with one of these :(
   */
  const asDefinePathConfig = {}
  Object.keys(global.ENV).forEach(key => {
    // asDefinePathConfig[`process.env.${key}`] = global.ENV[key]
    if (global.ENV[key] === false) {
      console.warn(
        'ENV_TODO_FIXME - value was false, process.env stringy bools',
        key
      )
      // asDefinePathConfig[`process.env.${key}`] = ''
      asDefinePathConfig[`process.env.${key}`] = '""'
      // asDefinePathConfig[`process.env.${key}`] = 'false'
      return
    }
    asDefinePathConfig[`process.env.${key}`] = JSON.stringify(global.ENV[key])
  })
  Object.assign(DEFINE_CONFIG, asDefinePathConfig)
  // ===
  // this one is safer, but will have stringy bools :(
  // Object.assign(ENV_CONFIG, global.ENV)

  // @todo @env
  // this will replace it everywhere, it better be correct
  // Object.keys(ENV_ENTRY).forEach(key => {
  //   DEFINE_CONFIG[key] = ENV_ENTRY[key]
  // })

  // const stringifyValue = key => DEFINE_CONFIG[key] = JSON.stringify(DEFINE_CONFIG[key])
  // Object.keys(DEFINE_CONFIG).forEach(stringifyValue)

  // @TODO use filter
  // if (process.env.LOG_ENV_CONFIG) {
  //   require('fliplog').when(!process.env.CI, log => {
  //     log
  //       .yellow('ENV_CONFIG')
  //       .data({ ...ENV_CONFIG, NODE_ENV: process.env.NODE_ENV })
  //       .echo()
  //     log
  //       .yellow('DEFINE_CONFIG')
  //       .data(DEFINE_CONFIG)
  //       .echo()
  //   })
  // }

  const webpackEnvPlugin = new EnvironmentPlugin(ENV_CONFIG)
  config.plugins.push(webpackEnvPlugin)
  const definePlugin = new DefinePlugin(DEFINE_CONFIG)
  config.plugins.push(definePlugin)

  // const plugins = [webpackEnvPlugin]
  // return webpackEnvPlugin
}

// These are process.env flags that you can use in your code in order to
// have advanced control over what is included/excluded in your bundles.
// For example you may only want certain parts of your code to be
// included/ran under certain conditions.
//
// Any process.env.X values that are matched will be code substituted for
// the associated values below.
//
// For example you may have the following in your code:
//   if (process.env.BUILD_FLAG_IS_CLIENT === 'true') {
//     console.log('Foo');
//   }
//
// If the BUILD_FLAG_IS_CLIENT was assigned a value of `false` the above
// code would be converted to the following by the webpack bundling
// process:
//   if ('false' === 'true') {
//     console.log('Foo');
//   }
//
// When your bundle is built using the UglifyJsPlugin unreachable code
// blocks like in the example above will be removed from the bundle
// final output. This is helpful for extreme cases where you want to
// ensure that code is only included/executed on specific targets, or for
// doing debugging.
//
// NOTE: We are stringifying the values to keep them in line with the
// expected type of a typical process.env member (i.e. string).
// @see https://github.com/ctrlplusb/react-universally/issues/395