| 1 | require('webpack'); |
||
| 2 | |||
| 3 | const webpack = require('webpack'); |
||
|
0 ignored issues
–
show
Unused Code
introduced
by
Loading history...
|
|||
| 4 | const path = require('path'); |
||
| 5 | const HtmlWebpackPlugin = require('html-webpack-plugin'); |
||
| 6 | const MiniCssExtractPlugin = require("mini-css-extract-plugin"); |
||
| 7 | const CleanWebpackPlugin = require('clean-webpack-plugin'); |
||
| 8 | const CopyWebpackPlugin = require('copy-webpack-plugin') |
||
|
0 ignored issues
–
show
|
|||
| 9 | const FaviconsWebpackPlugin = require('favicons-webpack-plugin') |
||
|
0 ignored issues
–
show
|
|||
| 10 | const WebpackPwaManifest = require('webpack-pwa-manifest') |
||
|
0 ignored issues
–
show
|
|||
| 11 | |||
| 12 | const config = { |
||
| 13 | mode: "development", |
||
| 14 | entry: [ |
||
| 15 | './src/js/app.js', |
||
| 16 | ], |
||
| 17 | output: { |
||
| 18 | path: path.resolve(__dirname, 'dist'), |
||
| 19 | filename: 'app.js', |
||
| 20 | libraryTarget: 'umd' |
||
| 21 | }, |
||
| 22 | module: { |
||
| 23 | rules: [{ |
||
| 24 | test: /\.s?[ac]ss$/, |
||
| 25 | use: [ |
||
| 26 | MiniCssExtractPlugin.loader, |
||
| 27 | { |
||
| 28 | loader: 'css-loader', // translates CSS into CommonJS modules |
||
| 29 | options: { |
||
| 30 | sourceMap: true, |
||
| 31 | minimize: true |
||
| 32 | } |
||
| 33 | }, |
||
| 34 | { |
||
| 35 | loader: 'postcss-loader', // Run post css actions |
||
| 36 | options: { |
||
| 37 | sourceMap: true, |
||
| 38 | plugins: function() { |
||
| 39 | return [ |
||
| 40 | require('postcss-flexbugs-fixes'), |
||
| 41 | require('autoprefixer') |
||
| 42 | ]; |
||
| 43 | } |
||
| 44 | } |
||
| 45 | }, |
||
| 46 | { |
||
| 47 | loader: 'sass-loader', // compiles SASS to CSS |
||
| 48 | options: { |
||
| 49 | sourceMap: true |
||
| 50 | } |
||
| 51 | } |
||
| 52 | ] |
||
| 53 | }, |
||
| 54 | { |
||
| 55 | test: /\.(png|jpg|gif|svg|ttf|woff2|woff|eot)$/, |
||
| 56 | use: 'file-loader' |
||
| 57 | }, |
||
| 58 | { |
||
| 59 | test: /.html$/, |
||
| 60 | use: { |
||
| 61 | loader: 'html-loader', |
||
| 62 | options: { |
||
| 63 | interpolate: true |
||
| 64 | } |
||
| 65 | } |
||
| 66 | }, |
||
| 67 | { |
||
| 68 | test: /\.js$/, |
||
| 69 | exclude: /node_modules/, |
||
| 70 | use: [{ |
||
| 71 | loader: 'babel-loader', // transpile to ES5 |
||
| 72 | options: { |
||
| 73 | presets: ['es2015'] |
||
| 74 | } |
||
| 75 | }] |
||
| 76 | } |
||
| 77 | ] |
||
| 78 | }, |
||
| 79 | plugins: [ |
||
| 80 | new CleanWebpackPlugin(['dist']), |
||
| 81 | //new FaviconsWebpackPlugin('./src/img/logo_title.png'), |
||
| 82 | //new CopyWebpackPlugin([{from:'./src/demo/html/img', to: 'img'}]), |
||
| 83 | new MiniCssExtractPlugin({ |
||
| 84 | filename: "app.css", |
||
| 85 | }), |
||
| 86 | new HtmlWebpackPlugin({ |
||
| 87 | filename: 'index.html', |
||
| 88 | template: './src/demo/html/index.html' |
||
| 89 | }), |
||
| 90 | new HtmlWebpackPlugin({ |
||
| 91 | filename: 'elements.html', |
||
| 92 | template: './src/demo/html/elements.html' |
||
| 93 | }), |
||
| 94 | ] |
||
| 95 | }; |
||
| 96 | |||
| 97 | |||
| 98 | |||
| 99 | |||
| 100 | var devConfig = Object.assign({}, config, { |
||
| 101 | mode: 'development', |
||
| 102 | devServer: { |
||
| 103 | contentBase: path.join(__dirname, 'dist'), |
||
| 104 | open: true, |
||
| 105 | openPage: 'index.html', |
||
| 106 | port: 3000 |
||
| 107 | }, |
||
| 108 | }); |
||
| 109 | |||
| 110 | var prodConfig = Object.assign({}, config, { |
||
| 111 | mode: 'production', |
||
| 112 | output: Object.assign({}, config.output, { |
||
| 113 | filename: 'app.min.js' |
||
| 114 | }), |
||
| 115 | }); |
||
| 116 | |||
| 117 | module.exports = [ |
||
| 118 | devConfig, prodConfig |
||
| 119 | ]; |
||
| 120 |