paperbits-demo/webpack.runtime.js at master · ComputeWorks/paperbits-demo · 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
const path = require("path");
const { merge } = require("webpack-merge");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");


const runtimeConfig = {
    mode: "none",
    target: "web",
    entry: {
        "scripts/theme": ["./src/startup.runtime.ts"],
    },
    output: {
        filename: "./[name].js",
        path: path.resolve(__dirname, "dist/runtime"),
    },
    module: {
        rules: [
            {
                test: /\.scss$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    { loader: "css-loader", options: { url: false } },
                    { loader: "postcss-loader" },
                    { loader: "sass-loader" }
                ]
            },
            {
                test: /\.tsx?$/,
                loader: "awesome-typescript-loader"
            },
            {
                test: /\.html$/,
                loader: "html-loader",
                options: {
                    esModule: true,
                    minimize: {
                        removeComments: false,
                        collapseWhitespace: false
                    }
                }
            },
            {
                test: /\.(png|woff|woff2|eot|ttf|svg)$/,
                loader: "url-loader",
                options: {
                    limit: 10000
                }
            },
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            {
                test: /\.liquid$/,
                loader: "raw-loader"
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({ filename: "[name].css", chunkFilename: "[id].css" }),
        new CopyWebpackPlugin({
            patterns: [
                { from: `./src/themes/website/styles/fonts`, to: "styles/fonts" },
                { from: `./src/themes/website/assets` }
            ]
        })
    ],
    resolve: {
        alias: {
            "vue$": "vue/dist/vue.esm.js"
        },
        extensions: [".ts", ".tsx", ".js", ".jsx", ".html", ".scss"]
    }
}

module.exports = (designer) => {
    const modification = {
        entry: {},
        output: {}
    }

    if (designer) {
        modification.entry["styles/theme"] = `./src/themes/website/styles/styles.design.scss`;
        modification.output["path"] = path.resolve(__dirname, "dist/designer");
    }
    else {
        modification.entry["styles/theme"] = `./src/themes/website/styles/styles.scss`
        modification.output["path"] = path.resolve(__dirname, "dist/publisher/assets");
    }

    return merge(runtimeConfig, modification);
};