@tremorvideo/blink-cli/src/build-banner/index.js

const path = require('path')
const fs = require('fs-extra')
const chalk = require('chalk')
const stripIndent = require('common-tags/lib/stripIndent')
const getImportant = require('../source-checker/get-important')
const fsOpts = { encoding: 'utf8' }
const minifyFiles = require('./minify-files')
const babel = require('babel-core')

module.exports = async ({ env, program, pkg }) => {
  try {
    const srcDirPath = path.join(program.cwd, './src')
    const distDirPath = path.join(program.cwd, './dist')
    const manifestJson = path.join(distDirPath, './manifest.json')
    const packageJson = path.join(program.cwd, './package.json')
    let kitVersion, manifest
    try {
      kitVersion = fs.readJsonSync(packageJson).version
      manifest = await fs.readJson(manifestJson, fsOpts)
    } catch (err) {
      console.log(chalk.red('⚠️  You may be in the wrong directory or haven\'t run \'blink build-manifest\''))
      await Promise.reject(err)
    }

    const creativeFileName = `${manifest.general.bridgeId}.js`
    let [sentry, createjs, jquery, banners, creative, components, apl, clips] = await Promise.all([
      fs.readFile(path.join(__dirname, '../../node_modules/@sentry/browser/build/bundle.min.js'), fsOpts),
      fs.readFile(path.join(srcDirPath, 'createjs-2019.11.15.min.js'), fsOpts),
      fs.readFile(path.join(srcDirPath, 'jquery.min.js'), fsOpts),
      fs.readFile(path.join(srcDirPath, 'banners.js'), fsOpts),
      fs.readFile(path.join(srcDirPath, creativeFileName), fsOpts).then((creative) => {
        return creative.replace(/new createjs.LoadQueue\(true\)/, 'new createjs.LoadQueue(true, $b.baseUrl)')
      }),
      getImportant('get-components.js', path.join(srcDirPath, creativeFileName)),
      '',
      !fs.existsSync(path.join(srcDirPath, 'clips.js')) ? '' : fs.readFile(path.join(srcDirPath, 'clips.js'), fsOpts)
    ])
    const babelPath = path.resolve(__dirname, '../../node_modules', 'babel-preset-env')
    creative = babel.transform(creative, { presets: babelPath, sourceType: 'script' }).code
    const files = {}
    const bannerOpts = {
      videos: manifest.videos,
      general: manifest.general,
      tvCustomEvents: manifest.tvCustomEvents,
      adParameters: {
        geoInfo: manifest.geoInfo
      }
    }
    files['banners.js'] = banners
    files[creativeFileName] = creative
    files['clips.js'] = clips
    files['get-mraid-ad.js'] = `(function() {
      new window.Banner(${JSON.stringify(bannerOpts)})
    })()`
    const minifyOpts = {
      warnings: false,
      compress: {
        drop_console: !env.withConsoleLogs,
        drop_debugger: !env.withDebuggerStatements
      },
      mangle: false,
      output: {
        beautify: false,
        quote_style: 1
      }
    }
    const componentTags = components.components
      .map((comp) => {
        comp.className = comp.className.toLowerCase().replace('blink.', '') + '-component'
        return comp
      })
      .reduce((tags, comp) => {
        const tag = `scope.setTag('${comp.className}', '${fs.readJsonSync(path.join(env.comp, comp.folder, '/package.json'), fsOpts).version}');`
        if (!tags.includes(tag)) tags.push(tag)
        return tags
      }, [])
      .join('')
    const sentryConfig = stripIndent`
      window.Sentry.init({
        dsn: 'https://f4891be3e8a7407bb4189c35c0054db6@sentry.io/224228',
        release: '${pkg.release}',
        environment: 'production',
        sampleRate: 0.1,
        blacklistUrls: [/localhost/, /127\\.0\\.0\\.1/]
      });
      window.Sentry.configureScope(function (scope) {
        scope.setTag('blink-cli', '${pkg.version}')
        ${componentTags}
        scope.setTag('starter-kit', '${kitVersion}')
        scope.addEventProcessor(function (event) {
          if (/trident/i.test(event.request.headers['User-Agent'])) return null
          if (window.$b && window.$b.adParameters && window.$b.adParameters.debug) {
            event.environment = 'test'
          }
          return event
        })
      })
    `
    const development = [sentry, sentryConfig, createjs, jquery].concat(Object.values(files)).join(';\n')
    const pDevelopment = fs.writeFile(path.join(distDirPath, apl ? 'ad_base.uncompressed.js' : 'ad.uncompressed.js'), development, fsOpts).then(() => {
      if (!program.silent) {
        console.log(`✅  Compiled ${apl ? 'ad_base.uncompressed.js' : 'ad.uncompressed.js'}`)
      }
    })
    const filesMinified = await minifyFiles(files, minifyOpts, program.silent)
    const sentryConfigMinified = await minifyFiles({ 'sentry-config.js': sentryConfig }, minifyOpts, program.silent)
    const production = [sentry, sentryConfigMinified, createjs, jquery, filesMinified].join(';\n')
    const pProducation = fs.writeFile(path.join(distDirPath, apl ? 'ad_base.js' : 'ad.js'), production, fsOpts).then(() => {
      if (!program.silent) {
        console.log(`✅  Minified ${apl ? 'ad_base.js' : 'ad.js'}`)
      }
    })
    let pAplDev, pAplProd
    await Promise.all([pDevelopment, pProducation, pAplDev, pAplProd])
    return { development, production }
  } catch (err) {
    if (!program.silent) console.log(chalk.red('⚠️  the ad did NOT build'))
    return Promise.reject(err)
  }
}