TeaSpeak
/
TeaWeb
1
0
Fork 0
Code Issues 1 Pull Requests Activity

Fixed some minor project setup issues

master
WolverinDEV 2021-03-17 14:00:35 +01:00
parent 503ca5db8b
commit ff610bf3ee
5 changed files with 34 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
babel.config.ts
View File

@ -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

2
loader/app/css/index.ts
View File

@ -1,3 +1,3 @@
import "./index.scss";
import "./loader.scss";
import "./overlay.css";
import "./overlay.scss";

4
loader/app/css/overlay.scss
View File

@ -45,9 +45,11 @@
margin-top: .5em
}
}
}
@media (max-height: 750px) {
@media (max-height: 750px) {
:global {
#critical-load .container {
top: unset;
}

5
setup_devel_environment.md
View File

@ -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

79
webpack.config.ts
View File

@ -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<Configuration &
//"devel-main": "./shared/js/devel_main.ts"
},
devtool: isDevelopment ? "inline-source-map" : undefined,
devtool: isDevelopment ? "inline-source-map" : "source-map",
mode: isDevelopment ? "development" : "production",
plugins: [
new CleanWebpackPlugin(),
new DefinePlugin(await generateDefinitions(target)),
new MiniCssExtractPlugin({
filename: isDevelopment ? '[name].css' : '[name].[contenthash].css',
chunkFilename: isDevelopment ? '[id].css' : '[id].[contenthash].css',
filename: isDevelopment ? "[name].[contenthash].css" : "[contenthash].css",
chunkFilename: isDevelopment ? "[name].[contenthash].css" : "[contenthash].css",
ignoreOrder: true
}),
new ManifestGenerator({
outputFileName: "manifest.json",
context: __dirname
}),
//new BundleAnalyzerPlugin(),
new webpack.DefinePlugin(await generateDefinitions(target)),
new SvgSpriteGenerator({
dtsOutputFolder: path.join(__dirname, "shared", "svg-sprites"),
publicPath: "js/",
@ -154,8 +144,11 @@ export const config = async (target: "web" | "client"): Promise<Configuration &
}
}
}),
generateIndexPlugin(target),
new HtmlWebpackInlineSourcePlugin(HtmlWebpackPlugin),
//new BundleAnalyzerPlugin(),
].filter(e => !!e),
module: {
@ -189,12 +182,18 @@ export const config = async (target: "web" | "client"): Promise<Configuration &
]
},
{
test: (module: string) => 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<Configuration &
}
]
},
{
test: (module: string) => 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"),