From caa48777484cf2707af2df2d3e628a9a93766277 Mon Sep 17 00:00:00 2001
From: Alf Eaton <eaton.alf@gmail.com>
Date: Fri, 8 Sep 2017 09:13:57 +0100
Subject: [PATCH] Standardise webpack configs
Move webpack configs to a single location, in xpub-styleguide.
Use localIdentName to add module and original class names to the class name.
---
.../styleguide.config.js | 1 -
.../webpack.config.js | 110 +---------------
.../component-dashboard/styleguide.config.js | 1 -
.../component-dashboard/webpack.config.js | 98 +--------------
.../component-manuscript/webpack.config.js | 4 +-
.../component-review/styleguide.config.js | 1 -
packages/component-review/webpack.config.js | 113 +----------------
.../component-submit/styleguide.config.js | 1 -
packages/component-submit/webpack.config.js | 113 +----------------
packages/xpub-edit/styleguide.config.js | 1 -
packages/xpub-edit/webpack.config.js | 89 +------------
.../xpub-styleguide/src/webpack-config.js | 119 ++++++++++++++++++
packages/xpub-styleguide/webpack.config.js | 77 +-----------
packages/xpub-ui/styleguide.config.js | 1 -
packages/xpub-ui/webpack.config.js | 113 +----------------
15 files changed, 136 insertions(+), 706 deletions(-)
create mode 100644 packages/xpub-styleguide/src/webpack-config.js
diff --git a/packages/component-authentication/styleguide.config.js b/packages/component-authentication/styleguide.config.js
index ecdb784f1..79f3ea499 100644
--- a/packages/component-authentication/styleguide.config.js
+++ b/packages/component-authentication/styleguide.config.js
@@ -5,7 +5,6 @@ module.exports = {
Wrapper: require.resolve('xpub-styleguide/src/components/Wrapper')
},
skipComponentsWithoutExample: true,
- webpackConfig: require('./webpack.config.js'),
serverPort: 6061,
theme: {
fontFamily: {
diff --git a/packages/component-authentication/webpack.config.js b/packages/component-authentication/webpack.config.js
index 1f35cccb8..4aa149ad2 100644
--- a/packages/component-authentication/webpack.config.js
+++ b/packages/component-authentication/webpack.config.js
@@ -1,109 +1,3 @@
-process.env.BABEL_ENV = 'development'
-process.env.NODE_ENV = 'development'
+const webpackConfig = require('xpub-styleguide/src/webpack-config')
-const path = require('path')
-const nodeExternals = require('webpack-node-externals')
-
-const include = [
- path.join(__dirname, 'src'),
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist')
- },
- devtool: 'cheap-module-source-map',
- externals: [nodeExternals({
- whitelist: [/\.(?!js$).{1,5}$/i]
- })],
- resolve: {
- symlinks: false
- },
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', {
- modules: false,
- }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // global CSS
- {
- test: /\.css$/,
- use: [
- 'style-loader',
- 'css-loader'
- ],
- },
-
- // global SCSS
- {
- test: /\.scss$/,
- use: [
- 'style-loader',
- 'css-loader',
- 'sass-loader'
- ],
- },
-
- // Files
- {
- exclude: [/\.js$/, /\.html$/, /\.json$/],
- loader: 'file-loader',
- options: {
- name: 'static/media/[name].[hash:8].[ext]',
- }
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
diff --git a/packages/component-dashboard/styleguide.config.js b/packages/component-dashboard/styleguide.config.js
index 992a051d7..9b69f1042 100644
--- a/packages/component-dashboard/styleguide.config.js
+++ b/packages/component-dashboard/styleguide.config.js
@@ -8,7 +8,6 @@ module.exports = {
faker: 'faker'
},
skipComponentsWithoutExample: true,
- webpackConfig: require('./webpack.config.js'),
serverPort: 6062,
theme: {
fontFamily: {
diff --git a/packages/component-dashboard/webpack.config.js b/packages/component-dashboard/webpack.config.js
index f0a5dd998..4aa149ad2 100644
--- a/packages/component-dashboard/webpack.config.js
+++ b/packages/component-dashboard/webpack.config.js
@@ -1,97 +1,3 @@
-process.env.BABEL_ENV = 'development'
-process.env.NODE_ENV = 'development'
+const webpackConfig = require('xpub-styleguide/src/webpack-config')
-const path = require('path')
-const webpack = require('webpack')
-const nodeExternals = require('webpack-node-externals')
-
-const include = [
- path.join(__dirname, 'src'),
- /pubsweet-[^/]+\/src/,
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist'),
- },
- devtool: 'cheap-module-source-map',
- externals: [nodeExternals({
- whitelist: [/\.(?!js$).{1,5}$/i]
- })],
- resolve: {
- symlinks: false
- },
- // plugins: [
- // new webpack.ProvidePlugin({
- // CONFIG: {
- // 'pubsweet-server': {}
- // }
- // }),
- // ],
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', { modules: false }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // Files
- {
- exclude: [/\.js$/, /\.html$/, /\.json$/],
- loader: 'file-loader',
- options: {
- name: 'static/media/[name].[hash:8].[ext]',
- }
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
diff --git a/packages/component-manuscript/webpack.config.js b/packages/component-manuscript/webpack.config.js
index 36de5c3d5..b3020046e 100644
--- a/packages/component-manuscript/webpack.config.js
+++ b/packages/component-manuscript/webpack.config.js
@@ -54,6 +54,7 @@ module.exports = {
loader: 'css-loader',
options: {
modules: true,
+ localIdentName: '[name]_[local]-[hash:base64:8]',
}
}
],
@@ -69,7 +70,8 @@ module.exports = {
loader: 'css-loader',
options: {
modules: true,
- importLoaders: 1
+ localIdentName: '[name]_[local]-[hash:base64:8]',
+ importLoaders: 1,
}
},
'sass-loader'
diff --git a/packages/component-review/styleguide.config.js b/packages/component-review/styleguide.config.js
index 1b16d0007..08ed095d2 100644
--- a/packages/component-review/styleguide.config.js
+++ b/packages/component-review/styleguide.config.js
@@ -8,7 +8,6 @@ module.exports = {
faker: 'faker'
},
skipComponentsWithoutExample: true,
- webpackConfig: require('./webpack.config.js'),
serverPort: 6065,
theme: {
fontFamily: {
diff --git a/packages/component-review/webpack.config.js b/packages/component-review/webpack.config.js
index cc2081f4b..4aa149ad2 100644
--- a/packages/component-review/webpack.config.js
+++ b/packages/component-review/webpack.config.js
@@ -1,112 +1,3 @@
-process.env.BABEL_ENV = 'development'
-process.env.NODE_ENV = 'development'
+const webpackConfig = require('xpub-styleguide/src/webpack-config')
-const path = require('path')
-const nodeExternals = require('webpack-node-externals')
-
-const include = [
- path.join(__dirname, 'src'),
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist'),
- },
- devtool: 'cheap-module-source-map',
- externals: [nodeExternals({
- whitelist: [/\.(?!js$).{1,5}$/i]
- })],
- resolve: {
- symlinks: false
- },
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', { modules: false }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // global CSS
- {
- test: /\.css$/,
- use: [
- 'style-loader',
- 'css-loader'
- ],
- },
-
- // global SCSS
- {
- test: /\.scss$/,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // Files
- {
- exclude: [/\.js$/, /\.html$/, /\.json$/],
- loader: 'file-loader',
- options: {
- name: 'static/media/[name].[hash:8].[ext]',
- }
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
diff --git a/packages/component-submit/styleguide.config.js b/packages/component-submit/styleguide.config.js
index e8e7e3157..ef2282aa0 100644
--- a/packages/component-submit/styleguide.config.js
+++ b/packages/component-submit/styleguide.config.js
@@ -8,7 +8,6 @@ module.exports = {
faker: 'faker'
},
skipComponentsWithoutExample: true,
- webpackConfig: require('./webpack.config.js'),
serverPort: 6064,
theme: {
fontFamily: {
diff --git a/packages/component-submit/webpack.config.js b/packages/component-submit/webpack.config.js
index cc2081f4b..4aa149ad2 100644
--- a/packages/component-submit/webpack.config.js
+++ b/packages/component-submit/webpack.config.js
@@ -1,112 +1,3 @@
-process.env.BABEL_ENV = 'development'
-process.env.NODE_ENV = 'development'
+const webpackConfig = require('xpub-styleguide/src/webpack-config')
-const path = require('path')
-const nodeExternals = require('webpack-node-externals')
-
-const include = [
- path.join(__dirname, 'src'),
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist'),
- },
- devtool: 'cheap-module-source-map',
- externals: [nodeExternals({
- whitelist: [/\.(?!js$).{1,5}$/i]
- })],
- resolve: {
- symlinks: false
- },
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', { modules: false }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // global CSS
- {
- test: /\.css$/,
- use: [
- 'style-loader',
- 'css-loader'
- ],
- },
-
- // global SCSS
- {
- test: /\.scss$/,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // Files
- {
- exclude: [/\.js$/, /\.html$/, /\.json$/],
- loader: 'file-loader',
- options: {
- name: 'static/media/[name].[hash:8].[ext]',
- }
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
diff --git a/packages/xpub-edit/styleguide.config.js b/packages/xpub-edit/styleguide.config.js
index d8e7a5f3b..504ff81d9 100644
--- a/packages/xpub-edit/styleguide.config.js
+++ b/packages/xpub-edit/styleguide.config.js
@@ -6,7 +6,6 @@ module.exports = {
},
serverPort: 6065,
skipComponentsWithoutExample: true,
- webpackConfig: require('./webpack.config.js'),
context: {
faker: 'faker'
},
diff --git a/packages/xpub-edit/webpack.config.js b/packages/xpub-edit/webpack.config.js
index 9b33525ec..4aa149ad2 100644
--- a/packages/xpub-edit/webpack.config.js
+++ b/packages/xpub-edit/webpack.config.js
@@ -1,88 +1,3 @@
-process.env.BABEL_ENV = 'development'
-process.env.NODE_ENV = 'development'
+const webpackConfig = require('xpub-styleguide/src/webpack-config')
-const path = require('path')
-// const nodeExternals = require('webpack-node-externals')
-
-const include = [
- path.join(__dirname, 'src'),
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist')
- },
- devtool: 'cheap-module-source-map',
- // externals: [nodeExternals({
- // whitelist: [/\.(?!js$).{1,5}$/i]
- // })],
- resolve: {
- symlinks: false
- },
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', { modules: false }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // Files
- {
- exclude: [/\.js$/, /\.html$/, /\.json$/],
- loader: 'file-loader',
- options: {
- name: 'static/media/[name].[hash:8].[ext]',
- }
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
diff --git a/packages/xpub-styleguide/src/webpack-config.js b/packages/xpub-styleguide/src/webpack-config.js
new file mode 100644
index 000000000..51e0bbfef
--- /dev/null
+++ b/packages/xpub-styleguide/src/webpack-config.js
@@ -0,0 +1,119 @@
+process.env.BABEL_ENV = 'development'
+process.env.NODE_ENV = 'development'
+
+const path = require('path')
+// const nodeExternals = require('webpack-node-externals')
+
+module.exports = dir => {
+ const include = [
+ path.join(dir, 'src'),
+ /pubsweet-[^/]+\/src/,
+ /xpub-[^/]+\/src/,
+ ]
+
+ return {
+ entry: './src/index.js',
+ output: {
+ filename: 'index.js',
+ path: path.join(dir, 'dist')
+ },
+ devtool: 'cheap-module-source-map',
+ // externals: [nodeExternals({
+ // whitelist: [/\.(?!js$).{1,5}$/i]
+ // })],
+ resolve: {
+ symlinks: false
+ },
+ module: {
+ rules: [
+ {
+ oneOf: [
+ // ES6 modules
+ {
+ test: /\.js$/,
+ include,
+ loader: 'babel-loader',
+ options: {
+ presets: [
+ ['env', {modules: false}],
+ 'react',
+ 'stage-2'
+ ],
+ cacheDirectory: true,
+ },
+ },
+
+ // CSS modules
+ {
+ test: /\.local\.css$/,
+ include,
+ use: [
+ 'style-loader',
+ {
+ loader: 'css-loader',
+ options: {
+ modules: true,
+ // sourceMap: true,
+ localIdentName: '[name]_[local]-[hash:base64:8]',
+ }
+ }
+ ],
+ },
+
+ // SCSS modules
+ {
+ test: /\.local\.scss$/,
+ include,
+ use: [
+ 'style-loader',
+ {
+ loader: 'css-loader',
+ options: {
+ modules: true,
+ importLoaders: 1,
+ // sourceMap: true,
+ localIdentName: '[name]_[local]-[hash:base64:8]',
+ }
+ },
+ 'sass-loader'
+ ],
+ },
+
+ // global CSS
+ {
+ test: /\.css$/,
+ use: [
+ 'style-loader',
+ 'css-loader'
+ ],
+ },
+
+ // global SCSS
+ {
+ test: /\.scss$/,
+ use: [
+ 'style-loader',
+ {
+ loader: 'css-loader',
+ options: {
+ importLoaders: 1,
+ }
+ },
+ 'sass-loader'
+ ],
+ },
+
+ // Files
+ {
+ exclude: [/\.js$/, /\.html$/, /\.json$/],
+ loader: 'file-loader',
+ options: {
+ name: 'static/media/[name].[hash:8].[ext]',
+ }
+ }
+ ]
+ }
+ ]
+ }
+ }
+}
diff --git a/packages/xpub-styleguide/webpack.config.js b/packages/xpub-styleguide/webpack.config.js
index c42f82e39..a50bd1983 100644
--- a/packages/xpub-styleguide/webpack.config.js
+++ b/packages/xpub-styleguide/webpack.config.js
@@ -1,76 +1,3 @@
-const path = require('path')
-const nodeExternals = require('webpack-node-externals')
+const webpackConfig = require('./src/webpack')
-const include = [
- path.join(__dirname, 'src'),
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist'),
- },
- devtool: 'cheap-module-source-map',
- externals: [nodeExternals({
- whitelist: [/\.(?!js$).{1,5}$/i]
- })],
- resolve: {
- symlinks: false
- },
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', { modules: false }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
diff --git a/packages/xpub-ui/styleguide.config.js b/packages/xpub-ui/styleguide.config.js
index bbaeb5e35..18efe3b1d 100644
--- a/packages/xpub-ui/styleguide.config.js
+++ b/packages/xpub-ui/styleguide.config.js
@@ -8,7 +8,6 @@ module.exports = {
faker: 'faker',
},
skipComponentsWithoutExample: true,
- webpackConfig: require('./webpack.config.js'),
theme: {
fontFamily: {
base: '"Fira Sans", sans-serif'
diff --git a/packages/xpub-ui/webpack.config.js b/packages/xpub-ui/webpack.config.js
index cf91776ec..4aa149ad2 100644
--- a/packages/xpub-ui/webpack.config.js
+++ b/packages/xpub-ui/webpack.config.js
@@ -1,112 +1,3 @@
-process.env.BABEL_ENV = 'development'
-process.env.NODE_ENV = 'development'
+const webpackConfig = require('xpub-styleguide/src/webpack-config')
-const path = require('path')
-const nodeExternals = require('webpack-node-externals')
-
-const include = [
- path.join(__dirname, 'src'),
- /xpub-[^/]+\/src/,
-]
-
-module.exports = {
- entry: './src/index.js',
- output: {
- filename: 'index.js',
- path: path.join(__dirname, 'dist')
- },
- devtool: 'cheap-module-source-map',
- externals: [nodeExternals({
- whitelist: [/\.(?!js$).{1,5}$/i]
- })],
- resolve: {
- symlinks: false
- },
- module: {
- rules: [
- {
- oneOf: [
- // ES6 modules
- {
- test: /\.js$/,
- include,
- loader: 'babel-loader',
- options: {
- presets: [
- ['env', { modules: false }],
- 'react',
- 'stage-2'
- ],
- cacheDirectory: true,
- },
- },
-
- // CSS modules
- {
- test: /\.local\.css$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- }
- }
- ],
- },
-
- // SCSS modules
- {
- test: /\.local\.scss$/,
- include,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- modules: true,
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // global CSS
- {
- test: /\.css$/,
- use: [
- 'style-loader',
- 'css-loader'
- ],
- },
-
- // global SCSS
- {
- test: /\.scss$/,
- use: [
- 'style-loader',
- {
- loader: 'css-loader',
- options: {
- importLoaders: 1
- }
- },
- 'sass-loader'
- ],
- },
-
- // Files
- {
- exclude: [/\.js$/, /\.html$/, /\.json$/],
- loader: 'file-loader',
- options: {
- name: 'static/media/[name].[hash:8].[ext]',
- }
- }
- ]
- }
- ]
- }
-}
+module.exports = webpackConfig(__dirname)
--
GitLab