オフラインでも画像を表示できるようにbase64にして埋め込むようにした

3 files changed, 22 insertions, 1 deletions

diff --git a/src/web/app/common/tags/error.tag b/src/web/app/common/tags/error.tag
index e4e0272a49..a06f17cd1c 100644
--- a/src/web/app/common/tags/error.tag
+++ b/src/web/app/common/tags/error.tag
@@ -1,5 +1,5 @@
 <mk-error>
-	<img src="/assets/error.jpg" alt=""/>
+	<img src="data:image/jpeg;base64,%base64:/assets/error.jpg%" alt=""/>
 	<h1>%i18n:common.tags.mk-error.title%</h1>
 	<p class="text">%i18n:common.tags.mk-error.description%</p>
 	<p class="thanks">%i18n:common.tags.mk-error.thanks%</p>
diff --git a/webpack/module/rules/base64.ts b/webpack/module/rules/base64.ts
new file mode 100644
index 0000000000..529816bd20
--- /dev/null
+++ b/webpack/module/rules/base64.ts
@@ -0,0 +1,19 @@
+/**
+ * Replace base64 symbols
+ */
+
+import * as fs from 'fs';
+const StringReplacePlugin = require('string-replace-webpack-plugin');
+
+export default () => ({
+	enforce: 'pre',
+	test: /\.(tag|js)$/,
+	exclude: /node_modules/,
+	loader: StringReplacePlugin.replace({
+		replacements: [{
+			pattern: /%base64:(.+?)%/g, replacement: (_, key) => {
+				return fs.readFileSync(__dirname + '/../../../src/web/' + key, 'base64');
+			}
+		}]
+	})
+});
diff --git a/webpack/module/rules/index.ts b/webpack/module/rules/index.ts
index 2707a9c2f1..9c1262b3d6 100644
--- a/webpack/module/rules/index.ts
+++ b/webpack/module/rules/index.ts
@@ -1,4 +1,5 @@
 import i18n from './i18n';
+import base64 from './base64';
 import themeColor from './theme-color';
 import tag from './tag';
 import stylus from './stylus';
@@ -6,6 +7,7 @@ import typescript from './typescript';
 
 export default (lang, locale) => [
 	i18n(lang, locale),
+	base64(),
 	themeColor(),
 	tag(),
 	stylus(),