webpack#Compilation TypeScript Examples

The following examples show how to use webpack#Compilation. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: dev.ts    From mpflow with MIT License 6 votes vote down vote up 
setupHooks = (context: DevContext, firstDone: () => void) => {
  let _firstDone = true

  const invalid = () => {
    context.stats = undefined
  }

  const done = (stats: compilation.MultiStats) => {
    context.stats = stats

    process.nextTick(() => {
      const { stats } = context
      if (!stats) return

      if (_firstDone) {
        _firstDone = false
        firstDone()
      }
    })
  }

  const { compiler } = context

  compiler.hooks.watchRun.tap('miniprogram-dev', invalid)
  compiler.hooks.invalid.tap('miniprogram-dev', invalid)
  compiler.hooks.done.tap('miniprogram-dev', done)
}
Example #2
Source File: index.ts    From reskript with MIT License 6 votes vote down vote up 
replace(compilation: Compilation) {
        const HtmlWebpackPlugin = findHtmlWebpackPlugin(compilation);

        if (!HtmlWebpackPlugin) {
            // 这个插件是始终要用的，但可能`entries`是空的所以它不需要起作用
            return;
        }

        const {afterTemplateExecution} = (HtmlWebpackPlugin as any).getHooks(compilation);
        afterTemplateExecution.tap(
            'interpolate-html-webpack-plugin',
            (data: {html: string}) => {
                data.html = interpolateEntryContent(data.html, this.replacements);
            }
        );
    }
Example #3
Source File: mini-program-application-analysis.service.ts    From angular-miniprogram with MIT License 6 votes vote down vote up 
constructor(
    private injector: Injector,
    @Inject(WEBPACK_COMPILATION) private compilation: Compilation,
    @Inject(TS_SYSTEM) private system: ts.System,
    @Inject(WEBPACK_COMPILER) private compiler: Compiler,
    @Inject(TS_CONFIG_TOKEN) private tsConfig: string,
    @Inject(OLD_BUILDER)
    private oldBuilder: ts.EmitAndSemanticDiagnosticsBuilderProgram | undefined,
    @Inject(PAGE_PATTERN_TOKEN) private pagePatternList: PagePattern[],
    private buildPlatform: BuildPlatform
  ) {}
Example #4
Source File: build.ts    From mpflow with MIT License 5 votes vote down vote up 
build: Plugin = (api, config) => {
  api.registerCommand(
    'build',
    '构建小程序',
    {},
    {
      dev: {
        type: 'boolean',
        description: '是否使用开发模式构建',
      },
      report: {
        type: 'boolean',
        description: '是否检查构建报告',
      },
    },
    async args => {
      api.setMode(args.dev ? 'development' : 'production')

      const chalk = require('chalk') as typeof import('chalk')
      const webpack = require('webpack') as typeof import('webpack')

      if (args.report) {
        api.configureWebpack(({ configure }) => {
          configure(webpackConfig => {
            webpackConfig.plugin('bundle-analyzer').use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
          })
        })
      }

      const webpackConfigs = Object.values(await api.resolveWebpackConfigs())

      try {
        // 开始构建前，清理输出目录
        await api.rmrf(path.join(api.resolve(config.outputDir || 'dist'), '*'))

        const compiler = webpack(webpackConfigs)

        ;(compiler as any).outputFileSystem = new WebpackOutputFileSystem((api as any).service.outputFileSystem)

        const stats = await new Promise<compilation.MultiStats>((resolve, reject) => {
          compiler.run((err, stats) => (err ? reject(err) : resolve(stats)))
        })

        if (stats.hasErrors()) throw new Error('Webpack build with errors.')
      } catch (err) {
        console.error(err)
        process.exit(1)
      }
    },
  )
}
Example #5
Source File: plugin.ts    From reskript with MIT License 5 votes vote down vote up 
inject(compilation: Compilation) {
        const {afterTemplateExecution} = HtmlWebpackPlugin.getHooks(compilation);
        afterTemplateExecution.tap(
            'transform-html-webpack-plugin',
            data => ({...data, html: this.transform(data.html)})
        );
    }
Example #6
Source File: index.ts    From reskript with MIT License 5 votes vote down vote up 
findHtmlWebpackPlugin = (compilation: Compilation) => {
    const isResolved = (plugin: WebpackPluginInstance) => {
        return plugin.constructor && plugin.constructor.name === 'HtmlWebpackPlugin';
    };

    const instance = (compilation.compiler.options.plugins || []).find(isResolved);
    return instance ? instance.constructor : null;
}