Skip to content

Commit

Permalink
Fixing pixi warnings + Cleaning packages + Creating dev & prod build …
Browse files Browse the repository at this point in the history
…outputs + Adding more quality tests with animation + Adding favicon + Cleaning up code.
  • Loading branch information
Kristof Van Der Haeghen committed Feb 15, 2024
1 parent 6c7ed84 commit 3a1f1d2
Show file tree
Hide file tree
Showing 13 changed files with 1,364 additions and 1,984 deletions.
Binary file added build/assets/favicon.ico
Binary file not shown.
3 changes: 2 additions & 1 deletion build/assets/index.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
<!DOCTYPE html>
<html>
<head>
<title>Simple Project</title>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<title>KTX2 & FFlate Compression</title>
<script>javascript:(function(){var script=document.createElement('script');script.onload=function(){var stats=new Stats();document.body.appendChild(stats.dom);requestAnimationFrame(function loop(){stats.update();requestAnimationFrame(loop)});};script.src='//mrdoob.github.io/stats.js/build/stats.min.js';document.head.appendChild(script);})()
</script>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0">
Expand Down
3 changes: 1 addition & 2 deletions build/tsconfig.base.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,7 @@
"sourceMap": true,
"strict": true,
"allowJs": true,
"typeRoots": ["./types", "../../../node_modules/@types", "../../../node_modules/@gp-types"],
"lib": ["ES5", "ES6", "ES2017", "ES2018", "ES2019", "ESNext", "DOM", "WebWorker"]
"typeRoots": ["./types", "../../../node_modules/@types", "../../../node_modules/@gp-types"]
},
"include": ["../src/**/*.ts", "./types/**/*.ts"]
}
2 changes: 1 addition & 1 deletion build/tsconfig.bundle.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"extends": "./tsconfig.base",
"compilerOptions": {
"module": "ESNext",
"target": "ES6",
"target": "ESNext",
"allowJs": true
}
}
45 changes: 31 additions & 14 deletions build/webpack.ts → build/webpack.dev.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,12 @@ import Webpack from 'webpack';
import { Config } from './webpack.utils';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import CopyPlugin from 'copy-webpack-plugin';
import TerserPlugin from 'terser-webpack-plugin';
// import CompressionPlugin from 'compression-webpack-plugin';
import Ip from 'ip';
import os from 'os';

const nodePolyfillPlugin = require('node-polyfill-webpack-plugin');
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');

const useLocalNetworkAddress = true;
const networkInterfaces = os.networkInterfaces();
Expand Down Expand Up @@ -59,31 +60,45 @@ const config: Webpack.Configuration = {
devServer: {
host: myNetworkAddress,
port: 8080,
inline: true,
open: true,
overlay: true,
compress: true,
openPage: 'index.html',
disableHostCheck: true,
writeToDisk: true,
contentBase: [Config.outPath, Path.join(__dirname, 'assets')],
client: {
overlay: true,
},
devMiddleware: {
writeToDisk: true,
},
open: 'index.html',
static: [{ directory: Config.outPathDev }, Path.join(__dirname, 'assets')],
},
optimization: {
minimize: true,
minimizer: [new TerserPlugin({
terserOptions: {
compress: {
drop_console: false, // Remove console.log statements
},
output: {
comments: false, // Remove comments
},
},
extractComments: false, // Remove license file with extracted comments
}),],
},
plugins: [
new HtmlWebpackPlugin({
title: Config.outputName,
template: './build/assets/index.html',
favicon: './build/assets/favicon.ico',
inject: false,
filename: 'index.html',

}),
new CopyPlugin({
patterns: [
{ from: Path.join(__dirname, '..', 'assets'), to: Path.join(Config.outPath, 'assets') },
{ from: Path.join(__dirname, '..', 'node_modules/pixi-basis-ktx2/assets/'), to: Path.join(Config.outPath, '') },
{ from: Path.join(__dirname, '..', 'assets'), to: Path.join(Config.outPathDev, 'assets') },
{ from: Path.join(__dirname, '..', 'node_modules/pixi-basis-ktx2/assets/'), to: Path.join(Config.outPathDev, '') },
],

}),
new nodePolyfillPlugin(),
new NodePolyfillPlugin(),
// new CompressionPlugin({
// algorithm: 'brotliCompress',
// filename: '[name].br[query]',
Expand All @@ -96,10 +111,12 @@ const config: Webpack.Configuration = {
],
output: {
filename: Config.outFileName,
path: Config.outPath + '/',
path: Config.outPathDev + '/',
libraryTarget: 'umd',
libraryExport: 'default',
library: Config.outputName,
hotUpdateChunkFilename: 'hot/hot-update.js',
hotUpdateMainFilename: 'hot/hot-update.json',
},
resolve: {
mainFields: ['module', 'main'],
Expand Down
85 changes: 85 additions & 0 deletions build/webpack.prod.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
/* eslint-disable @typescript-eslint/no-var-requires */
/* eslint-disable @typescript-eslint/no-explicit-any */
import Path from 'path';
import Webpack from 'webpack';
import { Config } from './webpack.utils';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import CopyPlugin from 'copy-webpack-plugin';
import TerserPlugin from 'terser-webpack-plugin';
// import CompressionPlugin from 'compression-webpack-plugin';

const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');

const config: Webpack.Configuration = {
devtool: false,
mode: 'production',
entry: {
testProject: './src/index.ts',
},
module: {
rules: [
{
test: /\.tsx?$/i,
use: {
loader: 'ts-loader',
options: {
configFile: 'build/tsconfig.bundle.json',
},
},
exclude: /node_modules/,
},
],
},
optimization: {
minimize: true,
minimizer: [new TerserPlugin({
terserOptions: {
compress: {
drop_console: false, // Remove console.log statements
},
output: {
comments: false, // Remove comments
},
},
extractComments: false, // Remove license file with extracted comments
}),],
},
plugins: [
new HtmlWebpackPlugin({
title: Config.outputName,
template: './build/assets/index.html',
favicon: './build/assets/favicon.ico',
inject: false,
filename: 'index.html',
}),
new CopyPlugin({
patterns: [
{ from: Path.join(__dirname, '..', 'assets'), to: Path.join(Config.outPathProd, 'assets') },
{ from: Path.join(__dirname, '..', 'node_modules/pixi-basis-ktx2/assets/'), to: Path.join(Config.outPathProd, '') },
],
}),
new NodePolyfillPlugin(),
// new CompressionPlugin({
// algorithm: 'brotliCompress',
// filename: '[name].br[query]',
// test: /\.(js|css|html|svg)$/,
// compressionOptions: { level: 6 },
// threshold: 10240,
// minRatio: 0.8,
// deleteOriginalAssets: false,
// }),
],
output: {
filename: Config.outFileName,
path: Config.outPathProd + '/',
libraryTarget: 'umd',
libraryExport: 'default',
library: Config.outputName,
},
resolve: {
mainFields: ['module', 'main'],
extensions: ['.ts', '.tsx', '.js', '.vue', '.json', 'd.ts'],
},
} as any;

export default config;
3 changes: 2 additions & 1 deletion build/webpack.utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import * as Path from 'path';

export class Config {
public static readonly outputName = 'testProject';
public static readonly outPath: string = Path.join(__dirname, '..', 'dist');
public static readonly outPathDev: string = Path.join(__dirname, '..', 'dist', 'dev');
public static readonly outPathProd: string = Path.join(__dirname, '..', 'dist', 'prod');
public static readonly outFileName: string = Config.outputName + '.js';
}
37 changes: 19 additions & 18 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
{
"name": "zip-unzip-ktx2",
"version": "0.0.3",
"version": "0.1.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "cross-env TS_NODE_PROJECT=build/tsconfig.node.json NODE_ENV=development webpack serve --config build/webpack.ts",
"dev": "cross-env TS_NODE_PROJECT=build/tsconfig.node.json NODE_ENV=development webpack serve --config build/webpack.dev.ts",
"build:dev": "cross-env TS_NODE_PROJECT=build/tsconfig.node.json NODE_ENV=development webpack --config build/webpack.dev.ts",
"build:prod": "cross-env TS_NODE_PROJECT=build/tsconfig.node.json NODE_ENV=production webpack --config build/webpack.prod.ts",
"lint": "tsc --build build/tsconfig.all.json && eslint --config build/eslintrc.js 'src/**/*'",
"format": "prettier --write --config build/prettierrc.json 'src/**/*'",
"ktx2:etc1s": "sh ./build/compression/compressToKTX2.sh --dir KTX2_ETC1S --t2 --encode etc1s --clevel 5 --qlevel 255",
Expand All @@ -28,19 +30,18 @@
"@types/terser-webpack-plugin": "^5.0.3",
"@types/uglify-js": "^3.13.0",
"@types/uglifyjs-webpack-plugin": "^1.1.1",
"@types/webpack": "^5.28.0",
"@types/webpack-dev-server": "^3.11.4",
"@types/webpack": "^5.28.5",
"@types/webpack-dev-server": "^4.7.2",
"@types/webpack-merge": "^5.0.0",
"@typescript-eslint/eslint-plugin": "^2.27.0",
"@typescript-eslint/eslint-plugin": "^7.0.1",
"@typescript-eslint/parser": "^2.27.0",
"clean-webpack-plugin": "^3.0.0",
"clean-webpack-plugin": "^4.0.0",
"compression-webpack-plugin": "^11.0.0",
"copy-webpack-plugin": "^9.0.1",
"copy-webpack-plugin": "^12.0.2",
"cross-env": "^7.0.3",
"decompress": "^4.2.1",
"eslint": "^7.29.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^3.4.0",
"eslint": "^8.56.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.1.3",
"file-loader": "^6.2.0",
"fs": "^0.0.1-security",
"howler": "^2.2.3",
Expand All @@ -52,7 +53,7 @@
"node-polyfill-webpack-plugin": "^1.1.4",
"npm-run-all": "^4.1.5",
"prettier": "^2.3.2",
"terser-webpack-plugin": "^5.1.4",
"terser-webpack-plugin": "^5.3.10",
"ts-loader": "^9.5.1",
"ts-node": "^10.9.2",
"tslib": "^2.3.0",
Expand All @@ -62,21 +63,21 @@
"uglify-js": "^3.13.10",
"uglifyjs-webpack-plugin": "^2.2.0",
"url-loader": "^2.1.0",
"webpack": "^5.40.0",
"webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.8.0"
"webpack": "^5.90.1",
"webpack-cli": "^5.1.4",
"webpack-dev-server": "^5.0.1",
"webpack-merge": "^5.10.0"
},
"dependencies": {
"@types/stats": "^0.16.30",
"@types/three": "^0.146.0",
"commander": "^10.0.1",
"convert-js-to-ts": "^1.3.2",
"fflate": "^0.8.0",
"fflate": "^0.8.2",
"figlet": "^1.6.0",
"js-to-ts-converter": "^0.18.2",
"lodash": "^4.17.21",
"pixi-basis-ktx2": "^0.0.17",
"pixi-basis-ktx2": "^0.0.19",
"pixi.js": "^7.x.x",
"stats.js": "^0.17.0",
"three": "^0.148.0",
Expand Down
6 changes: 3 additions & 3 deletions src/constants/constants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -204,9 +204,9 @@ export const assetsKTXTestPaths = [
'./assets/ktxTest/x2Portrait-uastc-mid3.ktx2',
'./assets/ktxTest/x2Portrait-uastc-high3.ktx2',
'./assets/ktxTest/x2Portrait-uastc-high4.ktx2',
'./assets/ktxTest/x2Portrait-uastc-mid3-zlib.ktx2',
'./assets/ktxTest/x2Portrait-uastc-high3-zlib.ktx2',
'./assets/ktxTest/x2Portrait-uastc-high4-zlib.ktx2'
// './assets/ktxTest/x2Portrait-uastc-mid3-zlib.ktx2', // zlib not yet supported in current ktx2 library
// './assets/ktxTest/x2Portrait-uastc-high3-zlib.ktx2',
// './assets/ktxTest/x2Portrait-uastc-high4-zlib.ktx2'
];

export const animTestPath = {
Expand Down
Loading

0 comments on commit 3a1f1d2

Please sign in to comment.