DRY up the webpack configs
Rick Carlino
parent
c4b69d4d0e
commit
4d2e7c9d9c
|
|
@ -0,0 +1,60 @@
|
|||
var devServerPort = 3808;
|
||||
var exec = require("child_process").exec;
|
||||
var execSync = require("child_process").execSync;
|
||||
var ExtractTextPlugin = require("extract-text-webpack-plugin");
|
||||
var fs = require("fs");
|
||||
var OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
|
||||
var path = require("path");
|
||||
var path = require("path");
|
||||
var production = process.env.RAILS_ENV === 'production';
|
||||
var StatsPlugin = require('stats-webpack-plugin');
|
||||
var UglifyJsPlugin = require("webpack-uglify-js-plugin");
|
||||
var webpack = require("webpack");
|
||||
|
||||
module.exports = function () {
|
||||
return {
|
||||
entry: {
|
||||
"bundle": path.resolve(__dirname, "../webpack/entry.tsx"),
|
||||
"front_page": "./webpack/front_page/index.tsx",
|
||||
"verification": "./webpack/verification.ts",
|
||||
"password_reset": "./webpack/password_reset/index.tsx",
|
||||
"tos_update": "./webpack/tos_update/index.tsx"
|
||||
},
|
||||
devtool: "eval",
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: [/\.scss$/, /\.css$/],
|
||||
use: ["style-loader", "css-loader", "sass-loader"]
|
||||
},
|
||||
{ test: /\.tsx?$/, use: "ts-loader" },
|
||||
{
|
||||
test: [/\.woff$/, /\.woff2$/, /\.ttf$/],
|
||||
use: "url-loader"
|
||||
},
|
||||
{
|
||||
test: [/\.eot$/, /\.svg(\?v=\d+\.\d+\.\d+)?$/],
|
||||
use: "file-loader"
|
||||
}
|
||||
]
|
||||
},
|
||||
// Allows imports without file extensions.
|
||||
resolve: {
|
||||
extensions: [".js", ".ts", ".tsx", ".css", ".scss", ".json"]
|
||||
},
|
||||
plugins: [
|
||||
// must match config.webpack.manifest_filename
|
||||
new StatsPlugin('manifest.json', {
|
||||
// We only need assetsByChunkName
|
||||
chunkModules: false,
|
||||
source: false,
|
||||
chunks: false,
|
||||
modules: false,
|
||||
assets: true
|
||||
})
|
||||
],
|
||||
node: {
|
||||
fs: "empty"
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
@ -1,75 +1,20 @@
|
|||
var devServerPort = 3808;
|
||||
var exec = require("child_process").exec;
|
||||
var execSync = require("child_process").execSync;
|
||||
var ExtractTextPlugin = require("extract-text-webpack-plugin");
|
||||
var fs = require("fs");
|
||||
var OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
|
||||
var path = require("path");
|
||||
var path = require("path");
|
||||
var production = process.env.RAILS_ENV === 'production';
|
||||
var StatsPlugin = require('stats-webpack-plugin');
|
||||
var UglifyJsPlugin = require("webpack-uglify-js-plugin");
|
||||
var webpack = require("webpack");
|
||||
var genConfig = require("./webpack.base");
|
||||
var conf = genConfig();
|
||||
|
||||
console.log("INSIDE DEV MODE WEBPACK CONFIG!");
|
||||
conf.output = {
|
||||
// must match config.webpack.output_dir
|
||||
path: path.join(__dirname, '..', 'public', 'webpack'),
|
||||
publicPath: '//localhost:' + devServerPort + '/webpack/',
|
||||
filename: '[name].js'
|
||||
};
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
"bundle": path.resolve(__dirname, "../webpack/entry.tsx"),
|
||||
"front_page": "./webpack/front_page/index.tsx",
|
||||
"verification": "./webpack/verification.ts",
|
||||
"password_reset": "./webpack/password_reset/index.tsx",
|
||||
"tos_update": "./webpack/tos_update/index.tsx"
|
||||
},
|
||||
devtool: "eval",
|
||||
output: {
|
||||
// must match config.webpack.output_dir
|
||||
path: path.join(__dirname, '..', 'public', 'webpack'),
|
||||
publicPath: '//localhost:' + devServerPort + '/webpack/',
|
||||
filename: '[name].js'
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: [/\.scss$/, /\.css$/],
|
||||
use: ["style-loader", "css-loader", "sass-loader"]
|
||||
},
|
||||
{ test: /\.tsx?$/, use: "ts-loader" },
|
||||
{
|
||||
test: [/\.woff$/, /\.woff2$/, /\.ttf$/],
|
||||
use: "url-loader"
|
||||
},
|
||||
{
|
||||
test: [/\.eot$/, /\.svg(\?v=\d+\.\d+\.\d+)?$/],
|
||||
use: "file-loader"
|
||||
}
|
||||
]
|
||||
},
|
||||
// Allows imports without file extensions.
|
||||
resolve: {
|
||||
extensions: [".js", ".ts", ".tsx", ".css", ".scss", ".json"]
|
||||
},
|
||||
devServer: {
|
||||
port: devServerPort,
|
||||
disableHostCheck: true,
|
||||
host: "0.0.0.0",
|
||||
headers: { 'Access-Control-Allow-Origin': '*' }
|
||||
},
|
||||
plugins: [
|
||||
// must match config.webpack.manifest_filename
|
||||
new StatsPlugin('manifest.json', {
|
||||
// We only need assetsByChunkName
|
||||
chunkModules: false,
|
||||
source: false,
|
||||
chunks: false,
|
||||
modules: false,
|
||||
assets: true
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
"process.env.NODE_ENV": JSON.stringify("production")
|
||||
})
|
||||
],
|
||||
node: {
|
||||
fs: "empty"
|
||||
}
|
||||
}
|
||||
conf.devServer = {
|
||||
port: devServerPort,
|
||||
disableHostCheck: true,
|
||||
host: "0.0.0.0",
|
||||
headers: { 'Access-Control-Allow-Origin': '*' }
|
||||
};
|
||||
|
||||
module.exports = conf;
|
||||
|
|
|
|||
|
|
@ -1,101 +1,56 @@
|
|||
'use strict';
|
||||
global.WEBPACK_ENV = "production";
|
||||
var devServerPort = 3808;
|
||||
var exec = require("child_process").exec;
|
||||
var execSync = require("child_process").execSync;
|
||||
var ExtractTextPlugin = require("extract-text-webpack-plugin");
|
||||
var fs = require("fs");
|
||||
var OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
|
||||
var path = require("path");
|
||||
var path = require("path");
|
||||
var production = process.env.RAILS_ENV === 'production';
|
||||
var StatsPlugin = require('stats-webpack-plugin');
|
||||
var genConfig = require("./webpack.base");
|
||||
var UglifyJsPlugin = require("webpack-uglify-js-plugin");
|
||||
var webpack = require("webpack");
|
||||
var OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
|
||||
|
||||
console.log("INSIDE PRODUCTION WEBPACK CONFIG!");
|
||||
var conf = genConfig();
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
"bundle": path.resolve(__dirname, "../webpack/entry.tsx"),
|
||||
"front_page": "./webpack/front_page/index.tsx",
|
||||
"verification": "./webpack/verification.ts",
|
||||
"password_reset": "./webpack/password_reset/index.tsx",
|
||||
"tos_update": "./webpack/tos_update/index.tsx"
|
||||
},
|
||||
devtool: "eval",
|
||||
output: {
|
||||
// must match config.webpack.output_dir
|
||||
path: path.join(__dirname, '..', 'public', 'webpack'),
|
||||
publicPath: '/webpack/',
|
||||
filename: '[name]-[chunkhash].js'
|
||||
},
|
||||
// Shared loaders for prod and dev.
|
||||
module: {
|
||||
rules: [
|
||||
{ test: /\.tsx?$/, use: "ts-loader" },
|
||||
{
|
||||
test: [/\.woff$/, /\.woff2$/, /\.ttf$/],
|
||||
use: "url-loader"
|
||||
},
|
||||
{
|
||||
test: [/\.eot$/, /\.svg(\?v=\d+\.\d+\.\d+)?$/],
|
||||
use: "file-loader"
|
||||
},
|
||||
// CHRIS:
|
||||
// I had to remove extractTextPlugin temporarily. Let's talk about getting it
|
||||
// put back in.
|
||||
// The code below runs DEVELOPMENT MODE in production, which is bad,
|
||||
// but maybe not as bad as the caching issues.
|
||||
{
|
||||
test: [/\.scss$/, /\.css$/],
|
||||
use: ["style-loader", "css-loader", "sass-loader"]
|
||||
}
|
||||
conf.output = {
|
||||
// must match config.webpack.output_dir
|
||||
path: path.join(__dirname, '..', 'public', 'webpack'),
|
||||
publicPath: '/webpack/',
|
||||
filename: '[name]-[chunkhash].js'
|
||||
};
|
||||
|
||||
]
|
||||
},
|
||||
// Allows imports without file extensions.
|
||||
resolve: {
|
||||
extensions: [".js", ".ts", ".tsx", ".css", ".scss", ".json"]
|
||||
},
|
||||
plugins: [
|
||||
// must match config.webpack.manifest_filename
|
||||
new StatsPlugin('manifest.json', {
|
||||
// We only need assetsByChunkName
|
||||
chunkModules: false,
|
||||
source: false,
|
||||
chunks: false,
|
||||
modules: false,
|
||||
assets: true
|
||||
}),
|
||||
new ExtractTextPlugin({
|
||||
// Temporary hotfix for some issues on staging.
|
||||
// - RC 12 MAY 17
|
||||
// filename: "dist/styles.css",
|
||||
filename: "dist/[name].[chunkhash].css",
|
||||
disable: false,
|
||||
allChunks: true
|
||||
}),
|
||||
new OptimizeCssAssetsPlugin({
|
||||
assetNameRegExp: /\.css$/g,
|
||||
cssProcessor: require("cssnano"),
|
||||
cssProcessorOptions: { discardComments: { removeAll: true } },
|
||||
canPrint: true
|
||||
}),
|
||||
new UglifyJsPlugin({
|
||||
cacheFolder: path.resolve(__dirname, "../public/dist/cached_uglify/"),
|
||||
debug: true,
|
||||
minimize: true,
|
||||
sourceMap: true,
|
||||
screw_ie8: true,
|
||||
output: { comments: false },
|
||||
compressor: { warnings: false }
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
"process.env.NODE_ENV": JSON.stringify("production")
|
||||
})
|
||||
],
|
||||
node: {
|
||||
fs: "empty"
|
||||
}
|
||||
}
|
||||
[
|
||||
// must match config.webpack.manifest_filename
|
||||
new StatsPlugin('manifest.json', {
|
||||
// We only need assetsByChunkName
|
||||
chunkModules: false,
|
||||
source: false,
|
||||
chunks: false,
|
||||
modules: false,
|
||||
assets: true
|
||||
}),
|
||||
new ExtractTextPlugin({
|
||||
// Temporary hotfix for some issues on staging.
|
||||
// - RC 12 MAY 17
|
||||
// filename: "dist/styles.css",
|
||||
filename: "dist/[name].[chunkhash].css",
|
||||
disable: false,
|
||||
allChunks: true
|
||||
}),
|
||||
new OptimizeCssAssetsPlugin({
|
||||
assetNameRegExp: /\.css$/g,
|
||||
cssProcessor: require("cssnano"),
|
||||
cssProcessorOptions: { discardComments: { removeAll: true } },
|
||||
canPrint: true
|
||||
}),
|
||||
new UglifyJsPlugin({
|
||||
cacheFolder: path.resolve(__dirname, "../public/dist/cached_uglify/"),
|
||||
debug: true,
|
||||
minimize: true,
|
||||
sourceMap: true,
|
||||
screw_ie8: true,
|
||||
output: { comments: false },
|
||||
compressor: { warnings: false }
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
"process.env.NODE_ENV": JSON.stringify("production")
|
||||
})
|
||||
].map(x => conf.plugins.push(x));
|
||||
|
||||
module.exports = conf;
|
||||
|
|
|
|||
Loading…
Reference in New Issue