diff --git a/babel.config.js b/babel.config.js new file mode 100644 index 000000000..08e71d91f --- /dev/null +++ b/babel.config.js @@ -0,0 +1,20 @@ +module.exports = { + babelrcRoots: [ + // Keep the root as a root + '.' + ], + presets: [ + [ + '@babel/preset-env', + { + useBuiltIns: 'usage', + corejs: 3 + } + ] + ], + plugins: [ + '@babel/plugin-proposal-class-properties', + '@babel/plugin-proposal-private-methods', + 'babel-plugin-dynamic-import-polyfill' + ] +}; diff --git a/package.json b/package.json index 25ecb72b4..0ef620153 100644 --- a/package.json +++ b/package.json @@ -10,9 +10,12 @@ "@babel/eslint-plugin": "^7.12.1", "@babel/plugin-proposal-class-properties": "^7.10.1", "@babel/plugin-proposal-private-methods": "^7.12.1", + "@babel/plugin-transform-modules-umd": "^7.12.1", "@babel/preset-env": "^7.12.7", + "@uupaa/dynamic-import-polyfill": "^1.0.2", "autoprefixer": "^9.8.6", "babel-loader": "^8.2.2", + "babel-plugin-dynamic-import-polyfill": "^1.0.0", "clean-webpack-plugin": "^3.0.0", "confusing-browser-globals": "^1.0.10", "copy-webpack-plugin": "^6.3.2", @@ -75,21 +78,6 @@ "workbox-core": "^5.1.4", "workbox-precaching": "^5.1.4" }, - "babel": { - "presets": [ - [ - "@babel/preset-env", - { - "useBuiltIns": "usage", - "corejs": 3 - } - ] - ], - "plugins": [ - "@babel/plugin-proposal-class-properties", - "@babel/plugin-proposal-private-methods" - ] - }, "browserslist": [ "last 2 Firefox versions", "last 2 Chrome versions", diff --git a/src/components/viewContainer.js b/src/components/viewContainer.js index 7bec82ee7..cfff424a1 100644 --- a/src/components/viewContainer.js +++ b/src/components/viewContainer.js @@ -1,3 +1,4 @@ +import { importModule } from '@uupaa/dynamic-import-polyfill'; import './viewManager/viewContainer.css'; import Dashboard from '../scripts/clientUtils'; @@ -17,7 +18,7 @@ import Dashboard from '../scripts/clientUtils'; controllerUrl = Dashboard.getPluginUrl(controllerUrl); const apiUrl = ApiClient.getUrl('/web/' + controllerUrl); - return import(/* webpackIgnore: true */ apiUrl).then((ControllerFactory) => { + return importModule(apiUrl).then((ControllerFactory) => { options.controllerFactory = ControllerFactory; }); } diff --git a/src/scripts/site.js b/src/scripts/site.js index 521d3181f..04f19c9d0 100644 --- a/src/scripts/site.js +++ b/src/scripts/site.js @@ -30,6 +30,8 @@ import { pageClassOn, serverAddress } from './clientUtils'; import '../libraries/screensavermanager'; import './serverNotifications'; import '../components/playback/playerSelectionMenu'; +import '../legacy/focusPreventScroll'; +import '../legacy/vendorStyles'; import SyncPlay from '../components/syncPlay/core'; import { playbackManager } from '../components/playback/playbackmanager'; import SyncPlayToasts from '../components/syncPlay/ui/syncPlayToasts'; diff --git a/webpack.common.js b/webpack.common.js index 3932854ef..09219a475 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -1,7 +1,6 @@ const path = require('path'); const { CleanWebpackPlugin } = require('clean-webpack-plugin'); const CopyPlugin = require('copy-webpack-plugin'); -const packageConfig = require('./package.json'); const WorkboxPlugin = require('workbox-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); @@ -24,7 +23,7 @@ const LibarchiveWasm = [ module.exports = { context: path.resolve(__dirname, 'src'), - target: 'web', + target: 'browserslist', resolve: { modules: [ path.resolve(__dirname, 'node_modules') @@ -91,11 +90,20 @@ module.exports = { }, { test: /\.js$/, - exclude: /node_modules[\\/](?!date-fns|epubjs)/, + exclude: /node_modules[\\/](?!@uupaa[\\/]dynamic-import-polyfill|date-fns|epubjs|flv.js|libarchive.js)/, + use: [{ + loader: 'babel-loader' + }] + }, + /* modules that Babel breaks when transforming to ESM */ + { + test: /node_modules[\\/](pdfjs-dist|xmldom)[\\/].*\.js$/, use: [{ loader: 'babel-loader', options: { - presets: packageConfig.babel.presets + plugins: [ + '@babel/transform-modules-umd' + ] } }] }, diff --git a/yarn.lock b/yarn.lock index 3d2895b2b..fae81a5cd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -152,7 +152,7 @@ dependencies: "@babel/types" "^7.12.1" -"@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.12.1", "@babel/helper-module-imports@^7.12.5": +"@babel/helper-module-imports@7.x", "@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.12.1", "@babel/helper-module-imports@^7.12.5": version "7.12.5" resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.12.5.tgz#1bfc0229f794988f76ed0a4d4e90860850b54dfb" integrity sha512-SR713Ogqg6++uexFRORf/+nPXMmWIn80TALu0uaFb+iQIUoR7bOC7zBWyzBs5b3tBBJXuyD0cRu1F15GyzjOWA== @@ -1148,6 +1148,11 @@ "@types/webpack-sources" "*" source-map "^0.6.0" +"@uupaa/dynamic-import-polyfill@^1.0.2": + version "1.0.2" + resolved "https://registry.yarnpkg.com/@uupaa/dynamic-import-polyfill/-/dynamic-import-polyfill-1.0.2.tgz#e540cfd8671058fe1e48f816fc8be07e058d5d3a" + integrity sha512-V3vzdXunOKKob1F+2ldv/4iGQoQA/iyqtW8PVlr1v16xCCKL831pGUubT+vs5/9wxTE/zBKEhjIjmmpK6nqw2A== + "@webassemblyjs/ast@1.9.0": version "1.9.0" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.9.0.tgz#bd850604b4042459a5a41cd7d338cbed695ed964" @@ -1606,6 +1611,13 @@ babel-plugin-dynamic-import-node@^2.3.3: dependencies: object.assign "^4.1.0" +babel-plugin-dynamic-import-polyfill@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/babel-plugin-dynamic-import-polyfill/-/babel-plugin-dynamic-import-polyfill-1.0.0.tgz#f251f47ae05ab193cb0ffb93cae0cfe0bf2bd122" + integrity sha512-fqdut9hGeaAgdX3sbAY25TkqA7LPmZB+Hf1XI67AppvhUw1cBST58BPwl5kPwDZYIvmqRwnsVKM0lppsQAsxhg== + dependencies: + "@babel/helper-module-imports" "7.x" + babel-plugin-syntax-object-rest-spread@^6.8.0: version "6.13.0" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"