From cbf9044577105d542b175410da916197db858436 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sun, 19 Feb 2017 15:54:19 +0900 Subject: [PATCH] Extract webpack config --- gulpfile.ts | 89 +-------------------------------------------- webpack.config.js | 1 + webpack.config.ts | 92 +++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 94 insertions(+), 88 deletions(-) create mode 100644 webpack.config.js create mode 100644 webpack.config.ts diff --git a/gulpfile.ts b/gulpfile.ts index 65c05d1f9..e70e13798 100644 --- a/gulpfile.ts +++ b/gulpfile.ts @@ -11,7 +11,6 @@ import * as ts from 'gulp-typescript'; import * as tslint from 'gulp-tslint'; import * as glob from 'glob'; import * as es from 'event-stream'; -import * as Webpack from 'webpack'; import * as webpack from 'webpack-stream'; import stylus = require('gulp-stylus'); import cssnano = require('gulp-cssnano'); @@ -156,93 +155,7 @@ gulp.task('build:client:scripts', () => new Promise(async (ok) => { // Get commit info const commit = await prominence(git).getLastCommit(); - const StringReplacePlugin = require('string-replace-webpack-plugin'); - - /* webpack options */ - const pack: Webpack.Configuration = { - entry: { - 'client': './src/web/app/client/script.js', - 'desktop': './src/web/app/desktop/script.js', - 'mobile': './src/web/app/mobile/script.js', - 'dev': './src/web/app/dev/script.js', - 'auth': './src/web/app/auth/script.js' - }, - module: { - rules: [ - { - enforce: 'pre', - test: /\.tag$/, - exclude: /node_modules/, - loader: StringReplacePlugin.replace({ - replacements: [ - { pattern: /\$theme\-color\-foreground/g, replacement: () => '#fff' }, - { pattern: /\$theme\-color/g, replacement: () => config.themeColor }, - ] - }) - }, - { - test: /\.tag$/, - exclude: /node_modules/, - loader: 'riot-tag-loader', - query: { - hot: false, - type: 'livescript', - style: 'stylus', - expr: false, - compact: true, - parserOptions: { - style: { - compress: true - } - } - } - }, - { - test: /\.styl$/, - exclude: /node_modules/, - use: [ - { - loader: 'style-loader' - }, - { - loader: 'css-loader' - }, - { - loader: 'stylus-loader' - } - ] - } - ] - }, - plugins: [ - new Webpack.DefinePlugin({ - VERSION: JSON.stringify(commit ? commit.hash : null), - CONFIG: { - themeColor: JSON.stringify(config.themeColor), - apiUrl: JSON.stringify(config.api_url), - aboutUrl: JSON.stringify(config.about_url), - devUrl: JSON.stringify(config.dev_url), - host: JSON.stringify(config.host), - url: JSON.stringify(config.url), - recaptcha: { - siteKey: JSON.stringify(config.recaptcha.siteKey), - } - } - }), - new StringReplacePlugin(), - ], - output: { - filename: '[name]/script.js' - } - }; - - if (isProduction) { - // TODO. - // see https://github.com/webpack/webpack/issues/2545 - //pack.plugins.push(new Webpack.optimize.UglifyJsPlugin()) - } - - let stream = webpack(pack, Webpack); + let stream = webpack(require('./webpack.config.js')(config, commit, env), require('webpack')); // TODO: remove this block if (isProduction) { diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 000000000..f41fd0bd8 --- /dev/null +++ b/webpack.config.js @@ -0,0 +1 @@ +eval(require('typescript').transpile(require('fs').readFileSync('./webpack.config.ts').toString())); diff --git a/webpack.config.ts b/webpack.config.ts new file mode 100644 index 000000000..03c8007cd --- /dev/null +++ b/webpack.config.ts @@ -0,0 +1,92 @@ +import * as webpack from 'webpack'; +const StringReplacePlugin = require('string-replace-webpack-plugin'); + +module.exports = (config, commit, env) => { + const isProduction = env === 'production'; + const isDebug = !isProduction; + + const pack: webpack.Configuration = { + entry: { + 'client': './src/web/app/client/script.js', + 'desktop': './src/web/app/desktop/script.js', + 'mobile': './src/web/app/mobile/script.js', + 'dev': './src/web/app/dev/script.js', + 'auth': './src/web/app/auth/script.js' + }, + module: { + rules: [ + { + enforce: 'pre', + test: /\.tag$/, + exclude: /node_modules/, + loader: StringReplacePlugin.replace({ + replacements: [ + { pattern: /\$theme\-color\-foreground/g, replacement: () => '#fff' }, + { pattern: /\$theme\-color/g, replacement: () => config.themeColor }, + ] + }) + }, + { + test: /\.tag$/, + exclude: /node_modules/, + loader: 'riot-tag-loader', + query: { + hot: false, + type: 'livescript', + style: 'stylus', + expr: false, + compact: true, + parserOptions: { + style: { + compress: true + } + } + } + }, + { + test: /\.styl$/, + exclude: /node_modules/, + use: [ + { + loader: 'style-loader' + }, + { + loader: 'css-loader' + }, + { + loader: 'stylus-loader' + } + ] + } + ] + }, + plugins: [ + new webpack.DefinePlugin({ + VERSION: JSON.stringify(commit ? commit.hash : null), + CONFIG: { + themeColor: JSON.stringify(config.themeColor), + apiUrl: JSON.stringify(config.api_url), + aboutUrl: JSON.stringify(config.about_url), + devUrl: JSON.stringify(config.dev_url), + host: JSON.stringify(config.host), + url: JSON.stringify(config.url), + recaptcha: { + siteKey: JSON.stringify(config.recaptcha.siteKey), + } + } + }), + new StringReplacePlugin(), + ], + output: { + filename: '[name]/script.js' + } + }; + + if (isProduction) { + // TODO. + // see https://github.com/webpack/webpack/issues/2545 + //pack.plugins.push(new Webpack.optimize.UglifyJsPlugin()) + } + + return pack; +};