Skip to content

Commit 2ac9bc2

Browse files
GRIMMR3AP3RMarkPieszak
GRIMMR3AP3R
authored and
MarkPieszak
committed
fix(webpack): StaticInjectorError
potential fix for TrilonIO#637 ?
1 parent 352fab8 commit 2ac9bc2

File tree

2 files changed

+283
-240
lines changed

2 files changed

+283
-240
lines changed

‎webpack.config.js‎

Lines changed: 150 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -16,138 +16,161 @@ const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin;
1616
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
1717
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
1818

19-
const { sharedModuleRules } = require('./webpack.additions');
19+
const {
20+
sharedModuleRules
21+
} = require('./webpack.additions');
2022

2123
module.exports = (env) => {
22-
// Configuration in common to both client-side and server-side bundles
23-
const isDevBuild = !(env && env.prod);
24-
const sharedConfig = {
25-
mode: isDevBuild ? "development" : "production",
26-
stats: { modules: false },
27-
context: __dirname,
28-
resolve: { extensions: [ '.js', '.ts' ] },
29-
output: {
30-
filename: '[name].js',
31-
publicPath: 'dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
32-
},
33-
module: {
34-
rules: [
35-
{ test: /\.ts$/, use: isDevBuild ? ['awesome-typescript-loader?silent=true', 'angular2-template-loader', 'angular2-router-loader'] : '@ngtools/webpack' },
36-
{ test: /\.html$/, use: 'html-loader?minimize=false' },
37-
{ test: /\.css$/, use: [ 'to-string-loader', isDevBuild ? 'css-loader' : 'css-loader?minimize' ] },
38-
{ test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' },
39-
...sharedModuleRules
40-
]
24+
// Configuration in common to both client-side and server-side bundles
25+
const isDevBuild = !(env && env.prod);
26+
const sharedConfig = {
27+
mode: isDevBuild ? "development" : "production",
28+
stats: {
29+
modules: false
30+
},
31+
context: __dirname,
32+
resolve: {
33+
extensions: ['.js', '.ts']
34+
},
35+
output: {
36+
filename: '[name].js',
37+
publicPath: 'dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
38+
},
39+
module: {
40+
rules: [{
41+
test: /\.ts$/,
42+
use: isDevBuild ? ['awesome-typescript-loader?silent=true', 'angular2-template-loader', 'angular2-router-loader'] : '@ngtools/webpack'
4143
},
42-
plugins: [new CheckerPlugin()]
43-
};
44-
45-
// Configuration for client-side bundle suitable for running in browsers
46-
const clientBundleOutputDir = './wwwroot/dist';
47-
const clientBundleConfig = merge(sharedConfig, {
48-
entry: { 'main-client': './ClientApp/boot.browser.ts' },
49-
output: { path: path.join(__dirname, clientBundleOutputDir) },
50-
plugins: [
51-
new webpack.DllReferencePlugin({
52-
context: __dirname,
53-
manifest: require('./wwwroot/dist/vendor-manifest.json')
54-
})
55-
].concat(isDevBuild ? [
56-
// Plugins that apply in development builds only
57-
new webpack.SourceMapDevToolPlugin({
58-
filename: '[file].map', // Remove this line if you prefer inline source maps
59-
moduleFilenameTemplate: path.relative(clientBundleOutputDir, '[resourcePath]') // Point sourcemap entries to the original file locations on disk
60-
})
61-
] : [
62-
// new BundleAnalyzerPlugin(),
63-
// Plugins that apply in production builds only
64-
new AngularCompilerPlugin({
65-
mainPath: path.join(__dirname, 'ClientApp/boot.browser.ts'),
66-
tsConfigPath: './tsconfig.json',
67-
entryModule: path.join(__dirname, 'ClientApp/app/app.module.browser#AppModule'),
68-
exclude: ['./**/*.server.ts']
69-
})
70-
]),
71-
devtool: isDevBuild ? 'cheap-eval-source-map' : false,
72-
node: {
73-
fs: "empty"
44+
{
45+
test: /\.html$/,
46+
use: 'html-loader?minimize=false'
7447
},
75-
optimization: {
76-
minimizer: [].concat(isDevBuild ? [] : [
77-
// we specify a custom UglifyJsPlugin here to get source maps in production
78-
new UglifyJsPlugin({
79-
cache: true,
80-
parallel: true,
81-
uglifyOptions: {
82-
compress: false,
83-
ecma: 6,
84-
mangle: true
85-
},
86-
sourceMap: true
87-
})
88-
])
89-
}
90-
});
91-
92-
// Configuration for server-side (prerendering) bundle suitable for running in Node
93-
const serverBundleConfig = merge(sharedConfig, {
94-
// resolve: { mainFields: ['main'] },
95-
entry: {
96-
'main-server':
97-
isDevBuild ? './ClientApp/boot.server.ts' : './ClientApp/boot.server.PRODUCTION.ts'
48+
{
49+
test: /\.css$/,
50+
use: ['to-string-loader', isDevBuild ? 'css-loader' : 'css-loader?minimize']
9851
},
99-
plugins: [
100-
new webpack.DllReferencePlugin({
101-
context: __dirname,
102-
manifest: require('./ClientApp/dist/vendor-manifest.json'),
103-
sourceType: 'commonjs2',
104-
name: './vendor'
105-
})
106-
].concat(isDevBuild ? [
107-
new webpack.ContextReplacementPlugin(
108-
// fixes WARNING Critical dependency: the request of a dependency is an expression
109-
/(.+)?angular(\\|\/)core(.+)?/,
110-
path.join(__dirname, 'src'), // location of your src
111-
{} // a map of your routes
112-
),
113-
new webpack.ContextReplacementPlugin(
114-
// fixes WARNING Critical dependency: the request of a dependency is an expression
115-
/(.+)?express(\\|\/)(.+)?/,
116-
path.join(__dirname, 'src'),
117-
{}
118-
)
119-
] : [
120-
// Plugins that apply in production builds only
121-
new AngularCompilerPlugin({
122-
mainPath: path.join(__dirname, 'ClientApp/boot.server.PRODUCTION.ts'),
123-
tsConfigPath: './tsconfig.json',
124-
entryModule: path.join(__dirname, 'ClientApp/app/app.module.server#AppModule'),
125-
exclude: ['./**/*.browser.ts']
126-
})
127-
]),
128-
output: {
129-
libraryTarget: 'commonjs',
130-
path: path.join(__dirname, './ClientApp/dist')
52+
{
53+
test: /\.(png|jpg|jpeg|gif|svg)$/,
54+
use: 'url-loader?limit=25000'
13155
},
132-
target: 'node',
133-
// switch to "inline-source-map" if you want to debug the TS during SSR
134-
devtool: isDevBuild ? 'cheap-eval-source-map' : false,
135-
optimization: {
136-
minimizer: [].concat(isDevBuild ? [] : [
137-
// we specify a custom UglifyJsPlugin here to get source maps in production
138-
new UglifyJsPlugin({
139-
cache: true,
140-
parallel: true,
141-
uglifyOptions: {
142-
compress: false,
143-
ecma: 6,
144-
mangle: true
145-
},
146-
sourceMap: true
147-
})
148-
])
149-
}
150-
});
56+
...sharedModuleRules
57+
]
58+
},
59+
plugins: [new CheckerPlugin()]
60+
};
61+
62+
// Configuration for client-side bundle suitable for running in browsers
63+
const clientBundleOutputDir = './wwwroot/dist';
64+
const clientBundleConfig = merge(sharedConfig, {
65+
entry: {
66+
'main-client': './ClientApp/boot.browser.ts'
67+
},
68+
output: {
69+
path: path.join(__dirname, clientBundleOutputDir)
70+
},
71+
plugins: [
72+
new webpack.DllReferencePlugin({
73+
context: __dirname,
74+
manifest: require('./wwwroot/dist/vendor-manifest.json')
75+
})
76+
].concat(isDevBuild ? [
77+
// Plugins that apply in development builds only
78+
new webpack.SourceMapDevToolPlugin({
79+
filename: '[file].map', // Remove this line if you prefer inline source maps
80+
moduleFilenameTemplate: path.relative(clientBundleOutputDir, '[resourcePath]') // Point sourcemap entries to the original file locations on disk
81+
})
82+
] : [
83+
// new BundleAnalyzerPlugin(),
84+
// Plugins that apply in production builds only
85+
new AngularCompilerPlugin({
86+
mainPath: path.join(__dirname, 'ClientApp/boot.browser.ts'),
87+
tsConfigPath: './tsconfig.json',
88+
entryModule: path.join(__dirname, 'ClientApp/app/app.module.browser#AppModule'),
89+
exclude: ['./**/*.server.ts']
90+
})
91+
]),
92+
devtool: isDevBuild ? 'cheap-eval-source-map' : false,
93+
node: {
94+
fs: "empty"
95+
},
96+
optimization: {
97+
minimizer: [].concat(isDevBuild ? [] : [
98+
// we specify a custom UglifyJsPlugin here to get source maps in production
99+
new UglifyJsPlugin({
100+
cache: true,
101+
parallel: true,
102+
uglifyOptions: {
103+
compress: false,
104+
ecma: 6,
105+
mangle: true,
106+
keep_classnames: true,
107+
keep_fnames: true
108+
},
109+
sourceMap: true
110+
})
111+
])
112+
}
113+
});
114+
115+
// Configuration for server-side (prerendering) bundle suitable for running in Node
116+
const serverBundleConfig = merge(sharedConfig, {
117+
// resolve: { mainFields: ['main'] },
118+
entry: {
119+
'main-server': isDevBuild ? './ClientApp/boot.server.ts' : './ClientApp/boot.server.PRODUCTION.ts'
120+
},
121+
plugins: [
122+
new webpack.DllReferencePlugin({
123+
context: __dirname,
124+
manifest: require('./ClientApp/dist/vendor-manifest.json'),
125+
sourceType: 'commonjs2',
126+
name: './vendor'
127+
})
128+
].concat(isDevBuild ? [
129+
new webpack.ContextReplacementPlugin(
130+
// fixes WARNING Critical dependency: the request of a dependency is an expression
131+
/(.+)?angular(\\|\/)core(.+)?/,
132+
path.join(__dirname, 'src'), // location of your src
133+
{} // a map of your routes
134+
),
135+
new webpack.ContextReplacementPlugin(
136+
// fixes WARNING Critical dependency: the request of a dependency is an expression
137+
/(.+)?express(\\|\/)(.+)?/,
138+
path.join(__dirname, 'src'), {}
139+
)
140+
] : [
141+
// Plugins that apply in production builds only
142+
new AngularCompilerPlugin({
143+
mainPath: path.join(__dirname, 'ClientApp/boot.server.PRODUCTION.ts'),
144+
tsConfigPath: './tsconfig.json',
145+
entryModule: path.join(__dirname, 'ClientApp/app/app.module.server#AppModule'),
146+
exclude: ['./**/*.browser.ts']
147+
})
148+
]),
149+
output: {
150+
libraryTarget: 'commonjs',
151+
path: path.join(__dirname, './ClientApp/dist')
152+
},
153+
target: 'node',
154+
// switch to "inline-source-map" if you want to debug the TS during SSR
155+
devtool: isDevBuild ? 'cheap-eval-source-map' : false,
156+
optimization: {
157+
minimizer: [].concat(isDevBuild ? [] : [
158+
// we specify a custom UglifyJsPlugin here to get source maps in production
159+
new UglifyJsPlugin({
160+
cache: true,
161+
parallel: true,
162+
uglifyOptions: {
163+
compress: false,
164+
ecma: 6,
165+
mangle: true,
166+
keep_classnames: true,
167+
keep_fnames: true
168+
},
169+
sourceMap: true
170+
})
171+
])
172+
}
173+
});
151174

152-
return [clientBundleConfig, serverBundleConfig];
175+
return [clientBundleConfig, serverBundleConfig];
153176
};

0 commit comments

Comments
 (0)