cakephp-pages/webpack.rules.js at master · 3xw/cakephp-pages · GitHub

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
81
const
path = require('path'),
conf = require('dotenv').config({path: './webpack.env'}),
webroot = conf.parsed.PUBLIC_PATH

const
MiniCssExtractPlugin = require("mini-css-extract-plugin"),
rules =
{
  babel:
  {
    test: /\.js$/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: ['@babel/preset-env'],
        plugins: ["@babel/plugin-syntax-dynamic-import"]
      }
    }
  },
  vue:
  {
    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
      cacheBusting: true,
    }
  },
  scss:
  {
    test: /\.(scss)$/,
    exclude: /node_modules/,
    use: [
      { loader: MiniCssExtractPlugin.loader},
      { loader: 'css-loader' },
      {
        loader: 'postcss-loader',
        options:
        {
          postcssOptions: {
            ident: 'postcss',
            plugins: [
              'postcss-preset-env',
              'pixrem',
              [
                'autoprefixer',
                {overrideBrowserslist: 'last 10 versions'}
              ],
              'cssnano'
            ]
          }
        }
      },
      { loader: 'resolve-url-loader' },
      { loader: 'sass-loader' },
    ]
  },
  css:
  {
    test: /\.css$/,
    use: [
      'vue-style-loader',
      'css-loader',
      'sass-loader'
    ]
  },
  fonts:
  {
    test: /\.(woff(2)?|ttf|otf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
    use: [{
      loader: 'file-loader',
      options: {
        name: '[name].[ext]',
        publicPath: webroot+'fonts/',
        outputPath: 'fonts/'
      }
    }]
  },
}

module.exports = rules