diff --git a/babel.config.ts b/babel.config.ts index e6e6d3bc..bdcb598f 100644 --- a/babel.config.ts +++ b/babel.config.ts @@ -4,7 +4,7 @@ export = api => { [ "@babel/preset-env", { - "corejs": { "version":3 }, + "corejs": {"version": 3}, "useBuiltIns": "usage", "targets": { "edge": "17", @@ -16,10 +16,12 @@ export = api => { } ] ]; + const plugins = [ ["@babel/transform-runtime"], ["@babel/plugin-transform-modules-commonjs"] ]; + return { presets, plugins diff --git a/loader/app/css/index.ts b/loader/app/css/index.ts index bfe4b056..36ac23e4 100644 --- a/loader/app/css/index.ts +++ b/loader/app/css/index.ts @@ -1,3 +1,3 @@ import "./index.scss"; import "./loader.scss"; -import "./overlay.css"; \ No newline at end of file +import "./overlay.scss"; \ No newline at end of file diff --git a/loader/app/css/overlay.scss b/loader/app/css/overlay.scss index d285c96d..be486a87 100644 --- a/loader/app/css/overlay.scss +++ b/loader/app/css/overlay.scss @@ -45,9 +45,11 @@ margin-top: .5em } } +} - @media (max-height: 750px) { +@media (max-height: 750px) { + :global { #critical-load .container { top: unset; } diff --git a/setup_devel_environment.md b/setup_devel_environment.md index 8ba98aac..4ecac232 100644 --- a/setup_devel_environment.md +++ b/setup_devel_environment.md @@ -5,7 +5,6 @@ The following tools or applications are required to develop the web client: - [1.2 NodeJS](#12-nodejs) - [1.2.2 NPM](#122-npm) - [1.3 Git bash](#13-git-bash) -- [1.4 Rust (Options)](#14-rust-optional-will-be-installed-automatically) ### 1.1 IDE It does not matter which IDE you use, @@ -27,10 +26,6 @@ IMPORTANT: NPM must be available within the PATH environment variable! For using the `.sh` build scripts you require Git Bash. A minimum of 4.2 is recommend, but in general every modern version should work. -### 1.4 Rust (Optional, will be installed automatically) -For building the web client audio library, you may want to install rust in advance. -Since it will be installed when executing the install libraries script, I'm not going into more detail here. - ## 2.0 Project initialization ### 2.1 Cloning the WebClient diff --git a/webpack.config.ts b/webpack.config.ts index 83654405..1069183c 100644 --- a/webpack.config.ts +++ b/webpack.config.ts @@ -3,11 +3,9 @@ import * as fs from "fs"; import trtransformer from "./tools/trgen/ts_transformer"; import {exec} from "child_process"; import * as util from "util"; +import * as path from "path"; -import {Configuration} from "webpack"; - -const path = require('path'); -const webpack = require("webpack"); +import { DefinePlugin, Configuration } from "webpack"; import { Plugin as SvgSpriteGenerator } from "webpack-svg-sprite-generator"; const ManifestGenerator = require("./webpack/ManifestPlugin"); @@ -53,17 +51,7 @@ const generateDefinitions = async (target: string) => { timestamp: timestamp, entry_chunk_name: JSON.stringify(target === "web" ? "shared-app" : "client-app") } as BuildDefinitions - }; -}; - -const isLoaderFile = (file: string) => { - if(file.startsWith(__dirname)) { - const path = file.substr(__dirname.length).replace(/\\/g, "/"); - if(path.startsWith("/loader/")) { - return true; - } - } - return false; + } as any; }; const generateIndexPlugin = (target: "web" | "client"): HtmlWebpackPlugin => { @@ -102,21 +90,23 @@ export const config = async (target: "web" | "client"): Promise !!e), module: { @@ -189,12 +182,18 @@ export const config = async (target: "web" | "client"): Promise module.match(/\.tsx?$/) && !isLoaderFile(module), + test: /\.tsx?$/, exclude: /node_modules/, use: [ { - loader: 'ts-loader', + loader: "babel-loader", + options: { + presets: ["@babel/preset-env"] + } + }, + { + loader: "ts-loader", options: { context: __dirname, colors: true, @@ -212,52 +211,28 @@ export const config = async (target: "web" | "client"): Promise module.match(/\.tsx?$/) && isLoaderFile(module), - exclude: /(node_modules|bower_components)/, - - use: [ - { - loader: "babel-loader", - options: { - presets: ["@babel/preset-env"] //Preset used for env setup - } - }, - { - loader: "ts-loader", - options: { - transpileOnly: true - } - } - ] - }, { test: /\.was?t$/, use: [ "./webpack/WatLoader.js" ] }, + { + test: /ChangeLog\.md$|\.html$/i, + type: "asset/source", + }, { test: /\.svg$/, use: 'svg-inline-loader' }, - { - test: /ChangeLog\.md$|\.html$/i, - use: { - loader: "raw-loader", - options: { - esModule: false - } - }, - }, { test: /\.(png|jpg|jpeg|gif)?$/, - use: 'file-loader', + type: "asset/resource" }, ] } as any, resolve: { - extensions: ['.tsx', '.ts', '.js', ".scss", ".css", ".wasm"], + extensions: ['.tsx', '.ts', '.js', ".scss"], alias: { "vendor/xbbcode": path.resolve(__dirname, "vendor/xbbcode/src"), "tc-events": path.resolve(__dirname, "vendor/TeaEventBus/src/index.ts"),