Merge pull request #313 from Reeywhaar/add-ie11-support

Restore ie11 support

web/.eslintrc.js

@@ -35,6 +35,12 @@ module.exports = {
         '@typescript-eslint/explicit-function-return-type': 0,
       },
     },
+    {
+      files: ['*.d.ts'],
+      rules: {
+        'no-var': 0,
+      },
+    },
     {
       files: ['*.test.ts', '*.test.tsx'],
       rules: {
@@ -65,6 +71,7 @@ module.exports = {
   },
   globals: {
     remark_config: true,
+    __webpack_public_path__: true,
   },
   rules: {
     '@typescript-eslint/indent': 0,

web/app/@types/__webpack_public_path__.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Veriable responsive for dynamic setting public path for
+ * assets. Dynamic imports with relative url will be resolved over this path.
+ *
+ * https://webpack.js.org/guides/public-path/#on-the-fly
+ */
+declare var __webpack_public_path__: string;

web/app/counter.ts

@@ -3,7 +3,7 @@ declare let remark_config: CounterConfig;
 
 import loadPolyfills from '@app/common/polyfills';
 import api from './common/api';
-import { COUNTER_NODE_CLASSNAME } from '@app/common/constants';
+import { COUNTER_NODE_CLASSNAME, BASE_URL } from '@app/common/constants';
 import { CounterConfig } from '@app/common/config-types';
 
 if (document.readyState === 'loading') {
@@ -13,6 +13,8 @@ if (document.readyState === 'loading') {
 }
 
 async function init(): Promise<void> {
+  __webpack_public_path__ = BASE_URL + '/web/';
+
   await loadPolyfills();
 
   const nodes: HTMLElement[] = [].slice.call(document.getElementsByClassName(COUNTER_NODE_CLASSNAME));

web/app/deleteme.ts

@@ -11,7 +11,10 @@ if (document.readyState === 'loading') {
 }
 
 async function init(): Promise<void> {
+  __webpack_public_path__ = BASE_URL + '/web/';
+
   await loadPolyfills();
+
   const node = document.getElementById(NODE_ID);
 
   if (!node) {

web/app/embed.ts

@@ -14,6 +14,7 @@ if (document.readyState === 'loading') {
 }
 
 async function init(): Promise<void> {
+  __webpack_public_path__ = BASE_URL + '/web/';
   await loadPolyfills();
 
   const node = document.getElementById(NODE_ID);

web/app/last-comments.tsx

@@ -17,6 +17,8 @@ if (document.readyState === 'loading') {
 }
 
 async function init(): Promise<void> {
+  __webpack_public_path__ = BASE_URL + '/web/';
+
   await loadPolyfills();
 
   const nodes = document.getElementsByClassName(LAST_COMMENTS_NODE_CLASSNAME);

web/app/remark.tsx

@@ -12,7 +12,7 @@ import reduxStore from '@app/store';
 // importing css
 import '@app/components/list-comments';
 
-import { NODE_ID } from '@app/common/constants';
+import { NODE_ID, BASE_URL } from '@app/common/constants';
 import { StaticStore } from '@app/common/static_store';
 import api from '@app/common/api';
 
@@ -23,6 +23,8 @@ if (document.readyState === 'loading') {
 }
 
 async function init(): Promise<void> {
+  __webpack_public_path__ = BASE_URL + '/web/';
+
   await loadPolyfills();
 
   const node = document.getElementById(NODE_ID);

web/webpack.config.js

@@ -166,10 +166,11 @@ module.exports = () => ({
     entrypoints: false,
   },
   devServer: {
-    host: 'localhost',
+    host: '0.0.0.0',
     port: 9000,
     contentBase: publicFolder,
     publicPath: '/web',
+    disableHostCheck: true,
     proxy: {
       '/api': {
         target: remarkUrl,