1 | const path = require('path');
|
2 | const HtmlPlugin = require('html-webpack-plugin');
|
3 | const VueLoaderPlugin = require('vue-loader/lib/plugin');
|
4 | const ProgressBarPlugin = require('progress-bar-webpack-plugin');
|
5 | const CleanWebpackPlugin = require('clean-webpack-plugin');
|
6 | const MiniCssExtractPlugin = require("mini-css-extract-plugin");
|
7 |
|
8 | const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
|
9 | const BuildTheme = process.env.npm_config_theme || 'default';
|
10 | const analyz = process.env.npm_config_analyz;
|
11 | const resolveResource = name => path.resolve(__dirname, '../src/theme/' + name);
|
12 | const isProduction = process.env.NODE_ENV === 'production';
|
13 | const minCssLoader = {
|
14 | loader: MiniCssExtractPlugin.loader,
|
15 | options: {
|
16 | hmr: process.env.NODE_ENV === 'development'
|
17 | },
|
18 | };
|
19 | const webpackConfig = {
|
20 | output: {
|
21 | path: path.resolve(__dirname, '../dist/'),
|
22 | filename: '[name]/index.js',
|
23 | publicPath: '/'
|
24 | },
|
25 | module: {
|
26 | rules: [
|
27 | {
|
28 | test: /\.css$/,
|
29 | use: [
|
30 | {
|
31 | loader: 'style-loader',
|
32 | },
|
33 | {
|
34 | loader: 'css-loader',
|
35 | }
|
36 | ]
|
37 | },
|
38 | {
|
39 | test: /\.(sa|sc)ss$/,
|
40 | use: [
|
41 | isProduction ? minCssLoader : 'style-loader',
|
42 | 'css-loader',
|
43 | 'sass-loader',
|
44 | {
|
45 | loader: 'sass-resources-loader',
|
46 | options: {
|
47 | resources: [resolveResource('common.scss'), resolveResource(`${BuildTheme}.scss`)]
|
48 | }
|
49 | }
|
50 | ]
|
51 | },
|
52 | {
|
53 | test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/,
|
54 | use: [
|
55 | {
|
56 | loader: 'url-loader',
|
57 | options: {
|
58 | limit: 100000,
|
59 | name: path.posix.join('fonts', 'k-view.[name].[ext]')
|
60 | }
|
61 | }
|
62 | ]
|
63 | },
|
64 | {
|
65 | test: /\.vue$/,
|
66 | use: [
|
67 | {
|
68 | loader: 'vue-loader',
|
69 | options: {
|
70 | compilerOptions: {
|
71 | preserveWhitespace: false
|
72 | },
|
73 | sourceMap: true,
|
74 | }
|
75 | }
|
76 | ],
|
77 | },
|
78 | {
|
79 | test: /\.md$/,
|
80 | use: [
|
81 | {
|
82 | loader: 'vue-loader',
|
83 | options: {
|
84 | compilerOptions: {
|
85 | preserveWhitespace: false
|
86 | },
|
87 | sourceMap: true,
|
88 | }
|
89 | },
|
90 | {
|
91 | loader: path.resolve(__dirname, './md-loader/index.js')
|
92 | }
|
93 | ],
|
94 | },
|
95 | {
|
96 | test: /\.js$/,
|
97 | use: [
|
98 | {
|
99 | loader: 'babel-loader',
|
100 | options: {
|
101 | sourceMap: true,
|
102 | },
|
103 | }
|
104 | ],
|
105 | exclude: /node_modules/
|
106 | }
|
107 | ]
|
108 | },
|
109 |
|
110 | resolve: {
|
111 | extensions: ['.js', '.vue', '.json'],
|
112 | alias: {
|
113 | '@': path.resolve(__dirname, 'src'),
|
114 | 'vue': 'vue/dist/vue.js',
|
115 | 'k-view':path.resolve(__dirname, '../'),
|
116 | }
|
117 | },
|
118 |
|
119 | plugins: [
|
120 | new VueLoaderPlugin(),
|
121 |
|
122 | new ProgressBarPlugin(),
|
123 |
|
124 | new CleanWebpackPlugin({
|
125 | verbose: true
|
126 | }),
|
127 |
|
128 |
|
129 |
|
130 |
|
131 |
|
132 |
|
133 |
|
134 |
|
135 |
|
136 |
|
137 |
|
138 |
|
139 | ],
|
140 |
|
141 | };
|
142 |
|
143 | if (isProduction) {
|
144 | webpackConfig.plugins.push(
|
145 | new MiniCssExtractPlugin({
|
146 | filename: '[name]/style.css',
|
147 | }),
|
148 | );
|
149 | }else{
|
150 | webpackConfig.plugins.push(
|
151 | new HtmlPlugin({
|
152 | template: './public/index.html',
|
153 | minify: {
|
154 | removeAttributeQuotes: false
|
155 | },
|
156 | hash: true,
|
157 | }),
|
158 |
|
159 | )
|
160 | }
|
161 |
|
162 | if(analyz){
|
163 | webpackConfig.plugins.push(
|
164 | new BundleAnalyzerPlugin()
|
165 | );
|
166 | }
|
167 |
|
168 | module.exports = webpackConfig; |
\ | No newline at end of file |