From 47c4a9a5f1008124db34054f3a2a32a73e7929da Mon Sep 17 00:00:00 2001
From: amphineko <sukareki@gmail.com>
Date: Mon, 16 Mar 2020 00:16:55 +0800
Subject: [PATCH] adjust webpack process

---
 package.json      |   2 +-
 src/index.html    |   5 +-
 src/index.js      |   2 -
 webpack.config.js | 134 ++++++++++++++++++----------------------------
 4 files changed, 55 insertions(+), 88 deletions(-)

diff --git a/package.json b/package.json
index 7a65227..93e6b02 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,7 @@
     "type": "git",
     "url": "git+https://github.com/amphineko/amphineko.git"
   },
-  "author": "Naoki Rinmous <sukareki@gmail.com>",
+  "author": "amphineko <sukareki@gmail.com>",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/amphineko/amphineko/issues"
diff --git a/src/index.html b/src/index.html
index 73a0c65..8b84db6 100644
--- a/src/index.html
+++ b/src/index.html
@@ -14,8 +14,9 @@
     <div id="container">
         <div class="section header grid-container grid-parent">
             <div class="split picture-container grid-30">
-                <a href="assets/images/amphineko.png">
-                    <img alt="picture of amphineko" class="picture" src="assets/images/amphineko@1x.jpg">
+                <a href="${require('./assets/images/amphineko.png')}">
+                    <img alt="picture of amphineko" class="picture"
+                        src="${require('./assets/images/amphineko@1x.jpg')}">
                 </a>
             </div>
 
diff --git a/src/index.js b/src/index.js
index 3a5e84b..e69de29 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,2 +0,0 @@
-import './index.html'
-import 'file-loader?name=[path][name].[ext]!./assets/images/amphineko.png'
diff --git a/webpack.config.js b/webpack.config.js
index f189461..1a04529 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,95 +1,63 @@
 const path = require('path')
 
-const BrowserSyncPlugin = require('browser-sync-webpack-plugin')
 const { CleanWebpackPlugin } = require('clean-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
 
-module.exports = (env, argv) => {
-    const isProduction = argv.mode === 'production'
+module.exports = {
+    context: path.resolve(__dirname, 'src'),
 
-    console.log(`Using mode ${isProduction ? 'PRODUCTION' : 'DEVELOPMENT'}`)
+    devServer: {
+        contentBase: path.resolve(__dirname, 'dist')
+    },
 
-    return {
-        context: path.resolve(__dirname, 'src'),
+    devtool: 'inline-source-map',
 
-        devServer: {
-            contentBase: path.resolve(__dirname, 'dist'),
-            port: 3100,
-        },
+    entry: {
+        index: './index.js',
+    },
 
-        devtool: 'inline-source-map',
-
-        mode: isProduction ? 'production' : 'development',
-
-        entry: {
-            index: './index.js',
-        },
-
-        module: {
-            rules: [
-                {
-                    test: /\.(jpg|png|svg)$/,
-                    include: [
-                        path.resolve(__dirname, 'src')
-                    ],
-                    use: [
-                        isProduction ?
-                            'file-loader?name=[path][name].[contenthash:8].[ext]' :
-                            'file-loader?name=[path][name].[ext]'
-                    ],
-                },
-                {
-                    test: /\.(eot|svg|ttf|woff2?)$/,
-                    include: [
-                        path.resolve(__dirname, 'node_modules')
-                    ],
-                    use: [
-                        isProduction ?
-                            'file-loader?name=assets/webfonts/[name].[contenthash:8].[ext]' :
-                            'file-loader?name=assets/webfonts/[name].[ext]'
-                    ],
-                },
-                {
-                    test: /\.(html)$/,
-                    use: [
-                        'file-loader?name=[name].[ext]',
-                        'extract-loader',
-                        'html-loader?interpolate',
-                    ],
-                },
-                {
-                    test: /\.(c|sa|sc)ss$/,
-                    use: [
-                        isProduction ?
-                            'file-loader?name=[name].[contenthash:8].css' :
-                            'file-loader?name=[name].css',
-                        'extract-loader',
-                        {
-                            loader: 'css-loader',
-                            options: {
-                                importLoaders: 1,
-                            },
+    module: {
+        rules: [
+            {
+                test: /\.(jpg|png|svg)$/,
+                loader: 'file-loader',
+                options: {
+                    name: 'assets/images/[name].[contenthash:8].[ext]'
+                }
+            },
+            {
+                test: /\.(eot|svg|ttf|woff2?)$/,
+                loader: 'file-loader',
+                options: {
+                    name: 'assets/webfonts/[name].[contenthash:8].[ext]'
+                }
+            },
+            {
+                test: /\.(c|sa|sc)ss$/,
+                use: [
+                    'file-loader?name=[name].[contenthash:8].css',
+                    'extract-loader',
+                    {
+                        loader: 'css-loader',
+                        options: {
+                            importLoaders: 1,
                         },
-                        'sass-loader',
-                    ],
-                },
-            ],
-        },
+                    },
+                    'sass-loader',
+                ],
+            },
+        ],
+    },
 
-        output: {
-            filename: '[name].[contenthash:8].js',
-            path: path.resolve(__dirname, 'dist'),
-        },
+    output: {
+        filename: '[name].[contenthash:8].js',
+        path: path.resolve(__dirname, 'dist'),
+    },
 
-        plugins: Array.prototype.concat([
-            new CleanWebpackPlugin(),
-        ], isProduction
-            ? []
-            : [
-                new BrowserSyncPlugin({
-                    host: 'localhost',
-                    open: false,
-                    proxy: 'http://localhost:3100/',
-                }),
-            ])
-    }
+    plugins: [
+        new CleanWebpackPlugin(),
+        new HtmlWebpackPlugin({
+            template: 'index.html'
+        })
+    ]
 }
\ No newline at end of file