An easy-to-use platform for EEG experimentation in the classroom
webpack
+460
-446
+7
configs/.eslintrc
+7
configs/.eslintrc
+48
configs/webpack.config.base.js
+48
configs/webpack.config.base.js
···
1
+
/**
2
+
* Base webpack config used across other specific configs
3
+
*/
4
+
5
+
import path from 'path';
6
+
import webpack from 'webpack';
7
+
import { dependencies as externals } from '../app/package.json';
8
+
9
+
export default {
10
+
externals: [...Object.keys(externals || {})],
11
+
12
+
module: {
13
+
rules: [
14
+
{
15
+
test: /\.tsx?$/,
16
+
exclude: /node_modules/,
17
+
use: {
18
+
loader: 'babel-loader',
19
+
options: {
20
+
cacheDirectory: true
21
+
}
22
+
}
23
+
}
24
+
]
25
+
},
26
+
27
+
output: {
28
+
path: path.join(__dirname, '..', 'app'),
29
+
// https://github.com/webpack/webpack/issues/1114
30
+
libraryTarget: 'commonjs2'
31
+
},
32
+
33
+
/**
34
+
* Determine the array of extensions that should be used to resolve modules.
35
+
*/
36
+
resolve: {
37
+
extensions: ['.js', '.jsx', '.json', '.ts', '.tsx'],
38
+
modules: [path.join(__dirname, '..', 'app'), 'node_modules']
39
+
},
40
+
41
+
plugins: [
42
+
new webpack.EnvironmentPlugin({
43
+
NODE_ENV: 'production'
44
+
}),
45
+
46
+
new webpack.NamedModulesPlugin()
47
+
]
48
+
};
+4
configs/webpack.config.eslint.js
+4
configs/webpack.config.eslint.js
+76
configs/webpack.config.main.prod.babel.js
+76
configs/webpack.config.main.prod.babel.js
···
1
+
/**
2
+
* Webpack config for production electron main process
3
+
*/
4
+
5
+
import path from 'path';
6
+
import webpack from 'webpack';
7
+
import merge from 'webpack-merge';
8
+
import TerserPlugin from 'terser-webpack-plugin';
9
+
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
10
+
import baseConfig from './webpack.config.base';
11
+
import CheckNodeEnv from '../internals/scripts/CheckNodeEnv';
12
+
import DeleteSourceMaps from '../internals/scripts/DeleteSourceMaps';
13
+
14
+
CheckNodeEnv('production');
15
+
DeleteSourceMaps();
16
+
17
+
export default merge.smart(baseConfig, {
18
+
devtool: process.env.DEBUG_PROD === 'true' ? 'source-map' : 'none',
19
+
20
+
mode: 'production',
21
+
22
+
target: 'electron-main',
23
+
24
+
entry: './app/main.dev.ts',
25
+
26
+
output: {
27
+
path: path.join(__dirname, '..'),
28
+
filename: './app/main.prod.js'
29
+
},
30
+
31
+
optimization: {
32
+
minimizer: process.env.E2E_BUILD
33
+
? []
34
+
: [
35
+
new TerserPlugin({
36
+
parallel: true,
37
+
sourceMap: true,
38
+
cache: true
39
+
})
40
+
]
41
+
},
42
+
43
+
plugins: [
44
+
new BundleAnalyzerPlugin({
45
+
analyzerMode:
46
+
process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled',
47
+
openAnalyzer: process.env.OPEN_ANALYZER === 'true'
48
+
}),
49
+
50
+
/**
51
+
* Create global constants which can be configured at compile time.
52
+
*
53
+
* Useful for allowing different behaviour between development builds and
54
+
* release builds
55
+
*
56
+
* NODE_ENV should be production so that modules do not perform certain
57
+
* development checks
58
+
*/
59
+
new webpack.EnvironmentPlugin({
60
+
NODE_ENV: 'production',
61
+
DEBUG_PROD: false,
62
+
START_MINIMIZED: false,
63
+
E2E_BUILD: false
64
+
})
65
+
],
66
+
67
+
/**
68
+
* Disables webpack processing of __dirname and __filename.
69
+
* If you run the bundle in node.js it falls back to these values of node.js.
70
+
* https://github.com/webpack/webpack/issues/2010
71
+
*/
72
+
node: {
73
+
__dirname: false,
74
+
__filename: false
75
+
}
76
+
});
+222
configs/webpack.config.renderer.prod.babel.js
+222
configs/webpack.config.renderer.prod.babel.js
···
1
+
/**
2
+
* Build config for electron renderer process
3
+
*/
4
+
5
+
import path from 'path';
6
+
import webpack from 'webpack';
7
+
import MiniCssExtractPlugin from 'mini-css-extract-plugin';
8
+
import OptimizeCSSAssetsPlugin from 'optimize-css-assets-webpack-plugin';
9
+
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
10
+
import merge from 'webpack-merge';
11
+
import TerserPlugin from 'terser-webpack-plugin';
12
+
import baseConfig from './webpack.config.base';
13
+
import CheckNodeEnv from '../internals/scripts/CheckNodeEnv';
14
+
import DeleteSourceMaps from '../internals/scripts/DeleteSourceMaps';
15
+
16
+
CheckNodeEnv('production');
17
+
DeleteSourceMaps();
18
+
19
+
export default merge.smart(baseConfig, {
20
+
devtool: process.env.DEBUG_PROD === 'true' ? 'source-map' : 'none',
21
+
22
+
mode: 'production',
23
+
24
+
target: 'electron-preload',
25
+
26
+
entry: path.join(__dirname, '..', 'app/index.tsx'),
27
+
28
+
output: {
29
+
path: path.join(__dirname, '..', 'app/dist'),
30
+
publicPath: './dist/',
31
+
filename: 'renderer.prod.js'
32
+
},
33
+
34
+
module: {
35
+
rules: [
36
+
// Extract all .global.css to style.css as is
37
+
{
38
+
test: /\.global\.css$/,
39
+
use: [
40
+
{
41
+
loader: MiniCssExtractPlugin.loader,
42
+
options: {
43
+
publicPath: './'
44
+
}
45
+
},
46
+
{
47
+
loader: 'css-loader',
48
+
options: {
49
+
sourceMap: true
50
+
}
51
+
}
52
+
]
53
+
},
54
+
// Pipe other styles through css modules and append to style.css
55
+
{
56
+
test: /^((?!\.global).)*\.css$/,
57
+
use: [
58
+
{
59
+
loader: MiniCssExtractPlugin.loader
60
+
},
61
+
{
62
+
loader: 'css-loader',
63
+
options: {
64
+
modules: {
65
+
localIdentName: '[name]__[local]__[hash:base64:5]'
66
+
},
67
+
sourceMap: true
68
+
}
69
+
}
70
+
]
71
+
},
72
+
// Add SASS support - compile all .global.scss files and pipe it to style.css
73
+
{
74
+
test: /\.global\.(scss|sass)$/,
75
+
use: [
76
+
{
77
+
loader: MiniCssExtractPlugin.loader
78
+
},
79
+
{
80
+
loader: 'css-loader',
81
+
options: {
82
+
sourceMap: true,
83
+
importLoaders: 1
84
+
}
85
+
},
86
+
{
87
+
loader: 'sass-loader',
88
+
options: {
89
+
sourceMap: true
90
+
}
91
+
}
92
+
]
93
+
},
94
+
// Add SASS support - compile all other .scss files and pipe it to style.css
95
+
{
96
+
test: /^((?!\.global).)*\.(scss|sass)$/,
97
+
use: [
98
+
{
99
+
loader: MiniCssExtractPlugin.loader
100
+
},
101
+
{
102
+
loader: 'css-loader',
103
+
options: {
104
+
modules: {
105
+
localIdentName: '[name]__[local]__[hash:base64:5]'
106
+
},
107
+
importLoaders: 1,
108
+
sourceMap: true
109
+
}
110
+
},
111
+
{
112
+
loader: 'sass-loader',
113
+
options: {
114
+
sourceMap: true
115
+
}
116
+
}
117
+
]
118
+
},
119
+
// WOFF Font
120
+
{
121
+
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
122
+
use: {
123
+
loader: 'url-loader',
124
+
options: {
125
+
limit: 10000,
126
+
mimetype: 'application/font-woff'
127
+
}
128
+
}
129
+
},
130
+
// WOFF2 Font
131
+
{
132
+
test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
133
+
use: {
134
+
loader: 'url-loader',
135
+
options: {
136
+
limit: 10000,
137
+
mimetype: 'application/font-woff'
138
+
}
139
+
}
140
+
},
141
+
// TTF Font
142
+
{
143
+
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
144
+
use: {
145
+
loader: 'url-loader',
146
+
options: {
147
+
limit: 10000,
148
+
mimetype: 'application/octet-stream'
149
+
}
150
+
}
151
+
},
152
+
// EOT Font
153
+
{
154
+
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
155
+
use: 'file-loader'
156
+
},
157
+
// SVG Font
158
+
{
159
+
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
160
+
use: {
161
+
loader: 'url-loader',
162
+
options: {
163
+
limit: 10000,
164
+
mimetype: 'image/svg+xml'
165
+
}
166
+
}
167
+
},
168
+
// Common Image Formats
169
+
{
170
+
test: /\.(?:ico|gif|png|jpg|jpeg|webp)$/,
171
+
use: 'url-loader'
172
+
}
173
+
]
174
+
},
175
+
176
+
optimization: {
177
+
minimizer: process.env.E2E_BUILD
178
+
? []
179
+
: [
180
+
new TerserPlugin({
181
+
parallel: true,
182
+
sourceMap: true,
183
+
cache: true
184
+
}),
185
+
new OptimizeCSSAssetsPlugin({
186
+
cssProcessorOptions: {
187
+
map: {
188
+
inline: false,
189
+
annotation: true
190
+
}
191
+
}
192
+
})
193
+
]
194
+
},
195
+
196
+
plugins: [
197
+
/**
198
+
* Create global constants which can be configured at compile time.
199
+
*
200
+
* Useful for allowing different behaviour between development builds and
201
+
* release builds
202
+
*
203
+
* NODE_ENV should be production so that modules do not perform certain
204
+
* development checks
205
+
*/
206
+
new webpack.EnvironmentPlugin({
207
+
NODE_ENV: 'production',
208
+
DEBUG_PROD: false,
209
+
E2E_BUILD: false
210
+
}),
211
+
212
+
new MiniCssExtractPlugin({
213
+
filename: 'style.css'
214
+
}),
215
+
216
+
new BundleAnalyzerPlugin({
217
+
analyzerMode:
218
+
process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled',
219
+
openAnalyzer: process.env.OPEN_ANALYZER === 'true'
220
+
})
221
+
]
222
+
});
-72
webpack.config.base.js
-72
webpack.config.base.js
···
1
-
/**
2
-
* Base webpack config used across other specific configs
3
-
*/
4
-
5
-
import path from 'path';
6
-
import webpack from 'webpack';
7
-
import fs from 'fs';
8
-
import { dependencies as externals } from './app/package.json';
9
-
import { dependencies as possibleExternals } from './package.json';
10
-
11
-
// Find all the dependencies without a `main` property and add them as webpack externals
12
-
function filterDepWithoutEntryPoints(dep: string): boolean {
13
-
// Return true if we want to add a dependency to externals
14
-
try {
15
-
// If the root of the dependency has an index.js, return true
16
-
if (fs.existsSync(path.join(__dirname, `node_modules/${dep}/index.js`))) {
17
-
return false;
18
-
}
19
-
const pgkString = fs
20
-
.readFileSync(path.join(__dirname, `node_modules/${dep}/package.json`))
21
-
.toString();
22
-
const pkg = JSON.parse(pgkString);
23
-
const fields = ['main', 'module', 'jsnext:main', 'browser'];
24
-
return !fields.some((field) => field in pkg);
25
-
} catch (e) {
26
-
console.log(e);
27
-
return true;
28
-
}
29
-
}
30
-
31
-
export default {
32
-
externals: [
33
-
...Object.keys(externals || {}),
34
-
...Object.keys(possibleExternals || {}).filter(filterDepWithoutEntryPoints),
35
-
],
36
-
37
-
module: {
38
-
rules: [
39
-
{
40
-
test: /\.jsx?$/,
41
-
exclude: /node_modules/,
42
-
use: {
43
-
loader: 'babel-loader',
44
-
options: {
45
-
cacheDirectory: true,
46
-
},
47
-
},
48
-
},
49
-
],
50
-
},
51
-
52
-
output: {
53
-
path: path.join(__dirname, 'app'),
54
-
// https://github.com/webpack/webpack/issues/1114
55
-
libraryTarget: 'commonjs2',
56
-
},
57
-
58
-
/**
59
-
* Determine the array of extensions that should be used to resolve modules.
60
-
*/
61
-
resolve: {
62
-
extensions: ['.js', '.jsx', '.json'],
63
-
modules: [path.join(__dirname, 'app'), 'node_modules'],
64
-
},
65
-
66
-
plugins: [
67
-
new webpack.EnvironmentPlugin({
68
-
NODE_ENV: 'production',
69
-
}),
70
-
new webpack.NamedModulesPlugin(),
71
-
],
72
-
};
-3
webpack.config.eslint.js
-3
webpack.config.eslint.js
-63
webpack.config.main.prod.js
-63
webpack.config.main.prod.js
···
1
-
/**
2
-
* Webpack config for production electron main process
3
-
*/
4
-
5
-
import webpack from 'webpack';
6
-
import merge from 'webpack-merge';
7
-
import UglifyJSPlugin from 'uglifyjs-webpack-plugin';
8
-
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
9
-
import baseConfig from './webpack.config.base';
10
-
import CheckNodeEnv from './internals/scripts/CheckNodeEnv';
11
-
12
-
CheckNodeEnv('production');
13
-
14
-
export default merge.smart(baseConfig, {
15
-
devtool: 'source-map',
16
-
17
-
mode: 'production',
18
-
19
-
target: 'electron-main',
20
-
21
-
entry: './app/main.dev',
22
-
23
-
output: {
24
-
path: __dirname,
25
-
filename: './app/main.prod.js',
26
-
},
27
-
28
-
plugins: [
29
-
new UglifyJSPlugin({
30
-
parallel: true,
31
-
sourceMap: true,
32
-
}),
33
-
34
-
new BundleAnalyzerPlugin({
35
-
analyzerMode: process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled',
36
-
openAnalyzer: process.env.OPEN_ANALYZER === 'true',
37
-
}),
38
-
39
-
/**
40
-
* Create global constants which can be configured at compile time.
41
-
*
42
-
* Useful for allowing different behaviour between development builds and
43
-
* release builds
44
-
*
45
-
* NODE_ENV should be production so that modules do not perform certain
46
-
* development checks
47
-
*/
48
-
new webpack.EnvironmentPlugin({
49
-
NODE_ENV: 'production',
50
-
DEBUG_PROD: 'true',
51
-
}),
52
-
],
53
-
54
-
/**
55
-
* Disables webpack processing of __dirname and __filename.
56
-
* If you run the bundle in node.js it falls back to these values of node.js.
57
-
* https://github.com/webpack/webpack/issues/2010
58
-
*/
59
-
node: {
60
-
__dirname: false,
61
-
__filename: false,
62
-
},
63
-
});
+16
-17
webpack.config.renderer.dev.dll.js
configs/webpack.config.renderer.dev.dll.babel.js
+16
-17
webpack.config.renderer.dev.dll.js
configs/webpack.config.renderer.dev.dll.babel.js
···
1
-
/* eslint global-require: 0, import/no-dynamic-require: 0 */
2
-
3
1
/**
4
2
* Builds the DLL for development electron renderer process
5
3
*/
···
8
6
import path from 'path';
9
7
import merge from 'webpack-merge';
10
8
import baseConfig from './webpack.config.base';
11
-
import { dependencies } from './package.json';
12
-
import CheckNodeEnv from './internals/scripts/CheckNodeEnv';
9
+
import { dependencies } from '../package.json';
10
+
import CheckNodeEnv from '../internals/scripts/CheckNodeEnv';
13
11
14
12
CheckNodeEnv('development');
15
13
16
-
const dist = path.resolve(process.cwd(), 'dll');
14
+
const dist = path.join(__dirname, '..', 'dll');
17
15
18
16
export default merge.smart(baseConfig, {
19
-
context: process.cwd(),
17
+
context: path.join(__dirname, '..'),
20
18
21
19
devtool: 'eval',
22
20
···
29
27
/**
30
28
* Use `module` from `webpack.config.renderer.dev.js`
31
29
*/
32
-
module: require('./webpack.config.renderer.dev').module,
30
+
module: require('./webpack.config.renderer.dev.babel').default.module,
33
31
34
32
entry: {
35
-
renderer: Object.keys(dependencies || {}).filter((dependency) => dependency !== 'font-awesome'),
33
+
renderer: Object.keys(dependencies || {})
36
34
},
37
35
38
36
output: {
39
37
library: 'renderer',
40
38
path: dist,
41
39
filename: '[name].dev.dll.js',
42
-
libraryTarget: 'var',
40
+
libraryTarget: 'var'
43
41
},
44
42
45
43
plugins: [
46
44
new webpack.DllPlugin({
47
45
path: path.join(dist, '[name].json'),
48
-
name: '[name]',
46
+
name: '[name]'
49
47
}),
48
+
50
49
/**
51
50
* Create global constants which can be configured at compile time.
52
51
*
···
57
56
* development checks
58
57
*/
59
58
new webpack.EnvironmentPlugin({
60
-
NODE_ENV: 'development',
59
+
NODE_ENV: 'development'
61
60
}),
62
61
63
62
new webpack.LoaderOptionsPlugin({
64
63
debug: true,
65
64
options: {
66
-
context: path.resolve(process.cwd(), 'app'),
65
+
context: path.join(__dirname, '..', 'app'),
67
66
output: {
68
-
path: path.resolve(process.cwd(), 'dll'),
69
-
},
70
-
},
71
-
}),
72
-
],
67
+
path: path.join(__dirname, '..', 'dll')
68
+
}
69
+
}
70
+
})
71
+
]
73
72
});
+87
-99
webpack.config.renderer.dev.js
configs/webpack.config.renderer.dev.babel.js
+87
-99
webpack.config.renderer.dev.js
configs/webpack.config.renderer.dev.babel.js
···
1
-
/* eslint global-require: 0, import/no-dynamic-require: 0 */
2
-
3
1
/**
4
2
* Build config for development electron renderer process that uses
5
3
* Hot-Module-Replacement
···
13
11
import chalk from 'chalk';
14
12
import merge from 'webpack-merge';
15
13
import { spawn, execSync } from 'child_process';
16
-
import ExtractTextPlugin from 'extract-text-webpack-plugin';
14
+
import { TypedCssModulesPlugin } from 'typed-css-modules-webpack-plugin';
17
15
import baseConfig from './webpack.config.base';
18
-
import CheckNodeEnv from './internals/scripts/CheckNodeEnv';
16
+
import CheckNodeEnv from '../internals/scripts/CheckNodeEnv';
19
17
20
-
CheckNodeEnv('development');
18
+
// When an ESLint server is running, we can't set the NODE_ENV so we'll check if it's
19
+
// at the dev webpack config is not accidentally run in a production environment
20
+
if (process.env.NODE_ENV === 'production') {
21
+
CheckNodeEnv('development');
22
+
}
21
23
22
24
const port = process.env.PORT || 1212;
23
25
const publicPath = `http://localhost:${port}/dist`;
24
-
const dll = path.resolve(process.cwd(), 'dll');
26
+
const dll = path.join(__dirname, '..', 'dll');
25
27
const manifest = path.resolve(dll, 'renderer.json');
26
-
const requiredByDLLConfig = module.parent.filename.includes('webpack.config.renderer.dev.dll');
28
+
const requiredByDLLConfig = module.parent.filename.includes(
29
+
'webpack.config.renderer.dev.dll'
30
+
);
27
31
28
32
/**
29
33
* Warn if the DLL is not built
···
31
35
if (!requiredByDLLConfig && !(fs.existsSync(dll) && fs.existsSync(manifest))) {
32
36
console.log(
33
37
chalk.black.bgYellow.bold(
34
-
'The DLL files are missing. Sit back while we build them for you with "npm run build-dll"'
38
+
'The DLL files are missing. Sit back while we build them for you with "yarn build-dll"'
35
39
)
36
40
);
37
-
execSync('npm run build-dll');
41
+
execSync('yarn build-dll');
38
42
}
39
43
40
44
export default merge.smart(baseConfig, {
···
44
48
45
49
target: 'electron-renderer',
46
50
47
-
entry: {
48
-
main: [
49
-
'react-hot-loader/patch',
50
-
`webpack-dev-server/client?http://localhost:${port}/`,
51
-
'webpack/hot/only-dev-server',
52
-
path.join(__dirname, 'app/index.js'),
53
-
],
54
-
viewer: [path.join(__dirname, 'app/viewer.js')],
55
-
},
51
+
entry: [
52
+
...(process.env.PLAIN_HMR ? [] : ['react-hot-loader/patch']),
53
+
`webpack-dev-server/client?http://localhost:${port}/`,
54
+
'webpack/hot/only-dev-server',
55
+
require.resolve('../app/index.tsx')
56
+
],
56
57
57
58
output: {
58
59
publicPath: `http://localhost:${port}/dist/`,
59
-
filename: '[name].entry.js',
60
+
filename: 'renderer.dev.js'
60
61
},
61
62
62
-
resolve: { symlinks: false },
63
-
64
63
module: {
65
64
rules: [
66
65
{
67
-
test: /\.jsx?$/,
68
-
exclude: /node_modules/,
69
-
use: {
70
-
loader: 'babel-loader',
71
-
options: {
72
-
cacheDirectory: true,
73
-
plugins: [
74
-
// Here, we include babel plugins that are only required for the
75
-
// renderer process. The 'transform-*' plugins must be included
76
-
// before react-hot-loader/babel
77
-
'@babel/plugin-proposal-class-properties',
78
-
'react-hot-loader/babel',
79
-
],
80
-
},
81
-
},
82
-
},
83
-
{
84
66
test: /\.global\.css$/,
85
67
use: [
86
68
{
87
-
loader: 'style-loader',
69
+
loader: 'style-loader'
88
70
},
89
71
{
90
72
loader: 'css-loader',
91
73
options: {
92
-
sourceMap: true,
93
-
},
94
-
},
95
-
],
74
+
sourceMap: true
75
+
}
76
+
}
77
+
]
96
78
},
97
79
{
98
80
test: /^((?!\.global).)*\.css$/,
99
81
use: [
100
82
{
101
-
loader: 'style-loader',
83
+
loader: 'style-loader'
102
84
},
103
85
{
104
86
loader: 'css-loader',
105
87
options: {
106
-
modules: true,
88
+
modules: {
89
+
localIdentName: '[name]__[local]__[hash:base64:5]'
90
+
},
107
91
sourceMap: true,
108
-
importLoaders: 1,
109
-
localIdentName: '[name]__[local]__[hash:base64:5]',
110
-
},
111
-
},
112
-
],
92
+
importLoaders: 1
93
+
}
94
+
}
95
+
]
113
96
},
114
97
// SASS support - compile all .global.scss files and pipe it to style.css
115
98
{
116
99
test: /\.global\.(scss|sass)$/,
117
100
use: [
118
101
{
119
-
loader: 'style-loader',
102
+
loader: 'style-loader'
120
103
},
121
104
{
122
105
loader: 'css-loader',
123
106
options: {
124
-
sourceMap: true,
125
-
},
107
+
sourceMap: true
108
+
}
126
109
},
127
110
{
128
-
loader: 'sass-loader',
129
-
},
130
-
],
111
+
loader: 'sass-loader'
112
+
}
113
+
]
131
114
},
132
115
// SASS support - compile all other .scss files and pipe it to style.css
133
116
{
134
117
test: /^((?!\.global).)*\.(scss|sass)$/,
135
118
use: [
136
119
{
137
-
loader: 'style-loader',
120
+
loader: 'style-loader'
138
121
},
139
122
{
140
123
loader: 'css-loader',
141
124
options: {
142
-
modules: true,
125
+
modules: {
126
+
localIdentName: '[name]__[local]__[hash:base64:5]'
127
+
},
143
128
sourceMap: true,
144
-
importLoaders: 1,
145
-
localIdentName: '[name]__[local]__[hash:base64:5]',
146
-
},
129
+
importLoaders: 1
130
+
}
147
131
},
148
132
{
149
-
loader: 'sass-loader',
150
-
},
151
-
],
133
+
loader: 'sass-loader'
134
+
}
135
+
]
152
136
},
153
137
// WOFF Font
154
138
{
···
157
141
loader: 'url-loader',
158
142
options: {
159
143
limit: 10000,
160
-
mimetype: 'application/font-woff',
161
-
},
162
-
},
144
+
mimetype: 'application/font-woff'
145
+
}
146
+
}
163
147
},
164
148
// WOFF2 Font
165
149
{
···
168
152
loader: 'url-loader',
169
153
options: {
170
154
limit: 10000,
171
-
mimetype: 'application/font-woff',
172
-
},
173
-
},
155
+
mimetype: 'application/font-woff'
156
+
}
157
+
}
174
158
},
175
159
// TTF Font
176
160
{
···
179
163
loader: 'url-loader',
180
164
options: {
181
165
limit: 10000,
182
-
mimetype: 'application/octet-stream',
183
-
},
184
-
},
166
+
mimetype: 'application/octet-stream'
167
+
}
168
+
}
185
169
},
186
170
// EOT Font
187
171
{
188
172
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
189
-
use: 'file-loader',
173
+
use: 'file-loader'
190
174
},
191
175
// SVG Font
192
176
{
···
195
179
loader: 'url-loader',
196
180
options: {
197
181
limit: 10000,
198
-
mimetype: 'image/svg+xml',
199
-
},
200
-
},
182
+
mimetype: 'image/svg+xml'
183
+
}
184
+
}
201
185
},
202
186
// Common Image Formats
203
187
{
204
188
test: /\.(?:ico|gif|png|jpg|jpeg|webp)$/,
205
-
use: 'url-loader',
206
-
},
207
-
],
189
+
use: 'url-loader'
190
+
}
191
+
]
208
192
},
209
-
193
+
resolve: {
194
+
alias: {
195
+
'react-dom': '@hot-loader/react-dom'
196
+
}
197
+
},
210
198
plugins: [
211
199
requiredByDLLConfig
212
200
? null
213
201
: new webpack.DllReferencePlugin({
214
-
context: process.cwd(),
202
+
context: path.join(__dirname, '..', 'dll'),
215
203
manifest: require(manifest),
216
-
sourceType: 'var',
204
+
sourceType: 'var'
217
205
}),
218
206
219
207
new webpack.HotModuleReplacementPlugin({
220
-
multiStep: true,
208
+
multiStep: true
209
+
}),
210
+
211
+
new TypedCssModulesPlugin({
212
+
globPattern: 'app/**/*.{css,scss,sass}'
221
213
}),
222
214
223
215
new webpack.NoEmitOnErrorsPlugin(),
···
235
227
* 'staging', for example, by changing the ENV variables in the npm scripts
236
228
*/
237
229
new webpack.EnvironmentPlugin({
238
-
NODE_ENV: 'development',
230
+
NODE_ENV: 'development'
239
231
}),
240
232
241
233
new webpack.LoaderOptionsPlugin({
242
-
debug: true,
243
-
}),
244
-
245
-
new ExtractTextPlugin({
246
-
filename: '[name].css',
247
-
}),
234
+
debug: true
235
+
})
248
236
],
249
237
250
238
node: {
251
239
__dirname: false,
252
-
__filename: false,
240
+
__filename: false
253
241
},
254
242
255
243
devServer: {
···
266
254
watchOptions: {
267
255
aggregateTimeout: 300,
268
256
ignored: /node_modules/,
269
-
poll: 100,
257
+
poll: 100
270
258
},
271
259
historyApiFallback: {
272
260
verbose: true,
273
-
disableDotRule: false,
261
+
disableDotRule: false
274
262
},
275
263
before() {
276
264
if (process.env.START_HOT) {
···
278
266
spawn('npm', ['run', 'start-main-dev'], {
279
267
shell: true,
280
268
env: process.env,
281
-
stdio: 'inherit',
269
+
stdio: 'inherit'
282
270
})
283
-
.on('close', (code) => process.exit(code))
284
-
.on('error', (spawnError) => console.error(spawnError));
271
+
.on('close', code => process.exit(code))
272
+
.on('error', spawnError => console.error(spawnError));
285
273
}
286
-
},
287
-
},
274
+
}
275
+
}
288
276
});
-192
webpack.config.renderer.prod.js
-192
webpack.config.renderer.prod.js
···
1
-
/**
2
-
* Build config for electron renderer process
3
-
*/
4
-
5
-
import path from 'path';
6
-
import webpack from 'webpack';
7
-
import ExtractTextPlugin from 'extract-text-webpack-plugin';
8
-
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
9
-
import merge from 'webpack-merge';
10
-
import UglifyJSPlugin from 'uglifyjs-webpack-plugin';
11
-
import baseConfig from './webpack.config.base';
12
-
import CheckNodeEnv from './internals/scripts/CheckNodeEnv';
13
-
14
-
CheckNodeEnv('production');
15
-
16
-
export default merge.smart(baseConfig, {
17
-
devtool: 'source-map',
18
-
19
-
mode: 'production',
20
-
21
-
target: 'electron-renderer',
22
-
23
-
entry: {
24
-
main: [path.join(__dirname, './app/index')],
25
-
viewer: [path.join(__dirname, './app/viewer')],
26
-
},
27
-
28
-
output: {
29
-
path: path.join(__dirname, 'app/dist'),
30
-
publicPath: './dist/',
31
-
filename: '[name].entry.js',
32
-
},
33
-
34
-
module: {
35
-
rules: [
36
-
// Extract all .global.css to style.css as is
37
-
{
38
-
test: /\.global\.css$/,
39
-
use: ExtractTextPlugin.extract({
40
-
publicPath: './',
41
-
use: {
42
-
loader: 'css-loader',
43
-
options: {
44
-
minimize: true,
45
-
},
46
-
},
47
-
fallback: 'style-loader',
48
-
}),
49
-
},
50
-
// Pipe other styles through css modules and append to style.css
51
-
{
52
-
test: /^((?!\.global).)*\.css$/,
53
-
use: ExtractTextPlugin.extract({
54
-
use: {
55
-
loader: 'css-loader',
56
-
options: {
57
-
modules: true,
58
-
minimize: true,
59
-
importLoaders: 1,
60
-
localIdentName: '[name]__[local]__[hash:base64:5]',
61
-
},
62
-
},
63
-
}),
64
-
},
65
-
// Add SASS support - compile all .global.scss files and pipe it to style.css
66
-
{
67
-
test: /\.global\.(scss|sass)$/,
68
-
use: ExtractTextPlugin.extract({
69
-
use: [
70
-
{
71
-
loader: 'css-loader',
72
-
options: {
73
-
minimize: true,
74
-
},
75
-
},
76
-
{
77
-
loader: 'sass-loader',
78
-
},
79
-
],
80
-
fallback: 'style-loader',
81
-
}),
82
-
},
83
-
// Add SASS support - compile all other .scss files and pipe it to style.css
84
-
{
85
-
test: /^((?!\.global).)*\.(scss|sass)$/,
86
-
use: ExtractTextPlugin.extract({
87
-
use: [
88
-
{
89
-
loader: 'css-loader',
90
-
options: {
91
-
modules: true,
92
-
minimize: true,
93
-
importLoaders: 1,
94
-
localIdentName: '[name]__[local]__[hash:base64:5]',
95
-
},
96
-
},
97
-
{
98
-
loader: 'sass-loader',
99
-
},
100
-
],
101
-
}),
102
-
},
103
-
// WOFF Font
104
-
{
105
-
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
106
-
use: {
107
-
loader: 'url-loader',
108
-
options: {
109
-
limit: 10000,
110
-
mimetype: 'application/font-woff',
111
-
},
112
-
},
113
-
},
114
-
// WOFF2 Font
115
-
{
116
-
test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
117
-
use: {
118
-
loader: 'url-loader',
119
-
options: {
120
-
limit: 10000,
121
-
mimetype: 'application/font-woff',
122
-
},
123
-
},
124
-
},
125
-
// TTF Font
126
-
{
127
-
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
128
-
use: {
129
-
loader: 'url-loader',
130
-
options: {
131
-
limit: 10000,
132
-
mimetype: 'application/octet-stream',
133
-
},
134
-
},
135
-
},
136
-
// EOT Font
137
-
{
138
-
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
139
-
use: 'file-loader',
140
-
},
141
-
// SVG Font
142
-
{
143
-
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
144
-
use: {
145
-
loader: 'url-loader',
146
-
options: {
147
-
limit: 10000,
148
-
mimetype: 'image/svg+xml',
149
-
},
150
-
},
151
-
},
152
-
// Common Image Formats
153
-
{
154
-
test: /\.(?:ico|gif|png|jpg|jpeg|webp)$/,
155
-
use: 'url-loader',
156
-
},
157
-
],
158
-
},
159
-
160
-
plugins: [
161
-
/**
162
-
* Create global constants which can be configured at compile time.
163
-
*
164
-
* Useful for allowing different behaviour between development builds and
165
-
* release builds
166
-
*
167
-
* NODE_ENV should be production so that modules do not perform certain
168
-
* development checks
169
-
*/
170
-
new webpack.EnvironmentPlugin({
171
-
NODE_ENV: 'production',
172
-
DEBUG_PROD: true,
173
-
}),
174
-
175
-
new UglifyJSPlugin({
176
-
parallel: true,
177
-
sourceMap: true,
178
-
}),
179
-
180
-
new ExtractTextPlugin('style.css'),
181
-
182
-
new BundleAnalyzerPlugin({
183
-
analyzerMode: process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled',
184
-
openAnalyzer: process.env.OPEN_ANALYZER === 'true',
185
-
}),
186
-
],
187
-
188
-
node: {
189
-
__dirname: false,
190
-
__filename: false,
191
-
},
192
-
});