-
Notifications
You must be signed in to change notification settings - Fork 145
/
webpack.mix.js
80 lines (73 loc) · 2.31 KB
/
webpack.mix.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
const mix = require('laravel-mix');
const path = require('path');
require('laravel-mix-workbox');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.disableSuccessNotifications();
mix
.options({
processCssUrls: false,
})
.js('resources/assets/vue/app.ts', 'public/js')
.vue()
.sass('resources/assets/sass/app.scss', 'public/css')
if (mix.inProduction()) {
mix.injectManifest({
swSrc: './resources/assets/vue/service-worker.js',
chunks: ['/js/app', 'login', 'example'],
});
}
mix.webpackConfig({
output: {
chunkFilename: mix.inProduction() ? "js/[name].[chunkhash].js" : "js/[name].js",
devtoolModuleFilenameTemplate: info => {
var $filename = 'sources://' + info.resourcePath;
if (info.resourcePath.match(/\.vue$/) && !info.allLoaders.match(/type=script/)) {
$filename = 'webpack-generated:///' + info.resourcePath + '?' + info.hash;
}
return $filename;
},
devtoolFallbackModuleFilenameTemplate: 'webpack:///[resource-path]?[hash]',
publicPath: mix.inProduction() ? '' : 'http://localhost:8080/',
},
devtool: mix.inProduction() ? 'hidden-source-map' : 'inline-source-map',
module: {
rules: [{
test: /\.tsx?$/,
loader: 'ts-loader',
options: {
appendTsSuffixTo: [/\.vue$/],
},
exclude: /node_modules/,
}, {
test: /\.(graphql|gql)$/,
loader: 'graphql-tag/loader',
exclude: /node_modules/,
}, {
test: /\.pug$/,
loader: 'pug-plain-loader'
}, {
test: /\.worker\.js$/,
use: { loader: 'worker-loader' }
}],
},
resolve: {
extensions: ['*', '.js', '.jsx', '.vue', '.ts', '.tsx'],
alias: {
styles: path.resolve(__dirname, 'resources/assets/sass'),
'@': path.resolve(__dirname, 'resources/assets/vue'),
},
},
plugins: process.env.NODE_ENV == 'production' ? [
new BundleAnalyzerPlugin(),
] : [],
});