rrpc-sermons-frontend/webpack.config.js at master · bherw/rrpc-sermons-frontend · 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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
const webpack = require('webpack')
const config = require('sapper/config/webpack.js')
const pkg = require('./package.json')
const preprocess = require('svelte-preprocess')

const mode = process.env.NODE_ENV
const dev = mode === 'development'

const extensions = ['.mjs', '.js', '.json', '.svelte', '.html', '.scss']
const mainFields = ['svelte', 'module', 'browser', 'main']
const modules = ['node_modules', 'src']

module.exports = {
  client: {
    entry: config.client.entry(),
    output: config.client.output(),
    resolve: { extensions, mainFields, modules },
    module: {
      rules: [
        {
          test: /\.(svelte|html)$/,
          use: {
            loader: 'svelte-loader',
            options: {
              dev,
              hydratable: true,
              hotReload: false, // pending https://github.com/sveltejs/svelte/issues/2377
              preprocess: preprocess(),
            },
          },
        },
        {
          test: /\.scss$/,
          use: [
            'style-loader',
            'css-loader', // translates CSS into CommonJS
            { loader: 'sass-loader', options: { includePaths: ['./node_modules'] } }, // compiles Sass to CSS, using Node Sass by default
          ],
        },
        {
          test: /\.(graphql|gql)$/,
          use: 'graphql-mini-transforms/webpack',
          exclude: /node_modules/,
        },
      ],
    },
    mode,
    plugins: [
      // pending https://github.com/sveltejs/svelte/issues/2377
      // dev && new webpack.HotModuleReplacementPlugin(),
      new webpack.DefinePlugin({
        'process.browser': true,
        'process.env.NODE_ENV': JSON.stringify(mode),
      }),
    ].filter(Boolean),
    devtool: dev && 'inline-source-map',
  },

  server: {
    entry: config.server.entry(),
    output: config.server.output(),
    target: 'node',
    resolve: { extensions, mainFields, modules },
    externals: Object.keys(pkg.dependencies).concat('encoding'),
    module: {
      rules: [
        {
          test: /\.(svelte|html)$/,
          use: {
            loader: 'svelte-loader',
            options: {
              css: false,
              generate: 'ssr',
              dev,
              preprocess: preprocess(),
            },
          },
        },
        {
          test: /\.scss$/,
          use: [
            'css-loader', // translates CSS into CommonJS
            { loader: 'sass-loader', options: { includePaths: ['./node_modules'] } }, // compiles Sass to CSS, using Node Sass by default
          ],
        },
        {
          test: /\.(graphql|gql)$/,
          use: 'graphql-mini-transforms/webpack',
          exclude: /node_modules/,
        },
      ],
    },
    mode: process.env.NODE_ENV,
    performance: {
      hints: false, // it doesn't matter if server.js is large
    },
  },

  serviceworker: {
    entry: config.serviceworker.entry(),
    output: config.serviceworker.output(),
    mode: process.env.NODE_ENV,
  },
}