First optimizations
This commit is contained in:
parent
d65f9eccd2
commit
1eee28ad37
11
.babelrc
Normal file
11
.babelrc
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
{
|
||||||
|
"presets": [
|
||||||
|
"@babel/preset-env",
|
||||||
|
[
|
||||||
|
"@babel/preset-react",
|
||||||
|
{
|
||||||
|
"runtime": "automatic"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
]
|
||||||
|
}
|
|
@ -12,7 +12,7 @@ function get() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function set(values) {
|
function set(values: any) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
resolve({
|
resolve({
|
||||||
"status": "ok",
|
"status": "ok",
|
||||||
|
|
|
@ -14,7 +14,7 @@ function get() {
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
|
|
||||||
function set(values) {
|
function set(values: any) {
|
||||||
return wrap(fetch('/cosmos/api/config', {
|
return wrap(fetch('/cosmos/api/config', {
|
||||||
method: 'PUT',
|
method: 'PUT',
|
||||||
headers: {
|
headers: {
|
||||||
|
|
|
@ -46,7 +46,7 @@ function list() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function addDevice(device) {
|
function addDevice(device: any) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
resolve({
|
resolve({
|
||||||
"data": {
|
"data": {
|
||||||
|
@ -103,7 +103,7 @@ function getLogs() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function connect(file) {
|
function connect(file: any) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
resolve({
|
resolve({
|
||||||
"status": "ok",
|
"status": "ok",
|
||||||
|
@ -111,7 +111,7 @@ function connect(file) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function block(nickname, devicename, block) {
|
function block(nickname: any, devicename: any, block: any) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
resolve({
|
resolve({
|
||||||
"status": "ok",
|
"status": "ok",
|
||||||
|
|
|
@ -9,7 +9,7 @@ function list() {
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
|
|
||||||
function addDevice(device) {
|
function addDevice(device: any) {
|
||||||
return wrap(fetch('/cosmos/api/constellation/devices', {
|
return wrap(fetch('/cosmos/api/constellation/devices', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
|
@ -56,7 +56,7 @@ function getLogs() {
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
|
|
||||||
function connect(file) {
|
function connect(file: Blob) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
const reader = new FileReader();
|
const reader = new FileReader();
|
||||||
|
|
||||||
|
@ -86,7 +86,7 @@ function connect(file) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function block(nickname, devicename, block) {
|
function block(nickname: any, devicename: any, block: any) {
|
||||||
return wrap(fetch(`/cosmos/api/constellation/block`, {
|
return wrap(fetch(`/cosmos/api/constellation/block`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
|
|
|
@ -1 +0,0 @@
|
||||||
/// <reference types="react-scripts" />
|
|
|
@ -1,14 +1,17 @@
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
// third-party
|
// third-party
|
||||||
import SyntaxHighlighter from 'react-syntax-highlighter';
|
import { Light as SyntaxHighlighter } from 'react-syntax-highlighter';
|
||||||
import { a11yDark } from 'react-syntax-highlighter/dist/esm/styles/hljs';
|
import { a11yDark } from 'react-syntax-highlighter/dist/esm/styles/hljs';
|
||||||
|
import js from 'react-syntax-highlighter/dist/esm/languages/hljs/javascript';
|
||||||
|
|
||||||
// ==============================|| CODE HIGHLIGHTER ||============================== //
|
// ==============================|| CODE HIGHLIGHTER ||============================== //
|
||||||
|
|
||||||
|
SyntaxHighlighter.registerLanguage('javascript', js);
|
||||||
|
|
||||||
export default function SyntaxHighlight({ children, ...others }) {
|
export default function SyntaxHighlight({ children, ...others }) {
|
||||||
return (
|
return (
|
||||||
<SyntaxHighlighter language="javacript" showLineNumbers style={a11yDark} {...others}>
|
<SyntaxHighlighter language="javascript" showLineNumbers style={a11yDark} {...others}>
|
||||||
{children}
|
{children}
|
||||||
</SyntaxHighlighter>
|
</SyntaxHighlighter>
|
||||||
);
|
);
|
||||||
|
|
5453
package-lock.json
generated
5453
package-lock.json
generated
File diff suppressed because it is too large
Load diff
41
package.json
41
package.json
|
@ -60,7 +60,6 @@
|
||||||
"simplebar": "^5.3.8",
|
"simplebar": "^5.3.8",
|
||||||
"simplebar-react": "^2.4.1",
|
"simplebar-react": "^2.4.1",
|
||||||
"timeago.js": "^4.0.2",
|
"timeago.js": "^4.0.2",
|
||||||
"typescript": "4.8.3",
|
|
||||||
"vite": "^4.2.0",
|
"vite": "^4.2.0",
|
||||||
"web-vitals": "^3.0.2",
|
"web-vitals": "^3.0.2",
|
||||||
"whiskers": "^0.4.0",
|
"whiskers": "^0.4.0",
|
||||||
|
@ -73,6 +72,14 @@
|
||||||
"react-dom": "^18.2.0"
|
"react-dom": "^18.2.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"resolutions": {
|
||||||
|
"terser": "npm:@swc/core"
|
||||||
|
},
|
||||||
|
"sideEffects": [
|
||||||
|
"**/*.css",
|
||||||
|
"**/*.scss",
|
||||||
|
"**/*.sass"
|
||||||
|
],
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"client": "vite",
|
"client": "vite",
|
||||||
"client-build": "vite build --base=/cosmos-ui/",
|
"client-build": "vite build --base=/cosmos-ui/",
|
||||||
|
@ -91,11 +98,6 @@
|
||||||
"react-app/jest"
|
"react-app/jest"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"babel": {
|
|
||||||
"presets": [
|
|
||||||
"@babel/preset-react"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"browserslist": {
|
"browserslist": {
|
||||||
"production": [
|
"production": [
|
||||||
">0.2%",
|
">0.2%",
|
||||||
|
@ -109,8 +111,16 @@
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.19.1",
|
"@babel/core": "^7.23.5",
|
||||||
"@babel/eslint-parser": "^7.19.1",
|
"@babel/eslint-parser": "^7.19.1",
|
||||||
|
"@babel/preset-env": "^7.23.5",
|
||||||
|
"@swc/core": "^1.3.100",
|
||||||
|
"babel-loader": "^9.1.3",
|
||||||
|
"browserify-fs": "^1.0.0",
|
||||||
|
"buffer": "^6.0.3",
|
||||||
|
"crypto-browserify": "^3.12.0",
|
||||||
|
"css-loader": "^6.8.1",
|
||||||
|
"css-minimizer-webpack-plugin": "^5.0.1",
|
||||||
"eslint": "^8.23.1",
|
"eslint": "^8.23.1",
|
||||||
"eslint-config-airbnb-typescript": "^17.0.0",
|
"eslint-config-airbnb-typescript": "^17.0.0",
|
||||||
"eslint-config-prettier": "^8.5.0",
|
"eslint-config-prettier": "^8.5.0",
|
||||||
|
@ -122,6 +132,21 @@
|
||||||
"eslint-plugin-prettier": "^4.2.1",
|
"eslint-plugin-prettier": "^4.2.1",
|
||||||
"eslint-plugin-react": "^7.31.8",
|
"eslint-plugin-react": "^7.31.8",
|
||||||
"eslint-plugin-react-hooks": "4.6.0",
|
"eslint-plugin-react-hooks": "4.6.0",
|
||||||
"prettier": "2.7.1"
|
"file-loader": "^6.2.0",
|
||||||
|
"html-webpack-plugin": "^5.5.3",
|
||||||
|
"mini-css-extract-plugin": "^2.7.6",
|
||||||
|
"path-browserify": "^1.0.1",
|
||||||
|
"prettier": "2.7.1",
|
||||||
|
"sass": "^1.69.5",
|
||||||
|
"sass-loader": "^13.3.2",
|
||||||
|
"stream-browserify": "^3.0.0",
|
||||||
|
"style-loader": "^3.3.3",
|
||||||
|
"ts-loader": "^9.5.1",
|
||||||
|
"typescript": "^5.3.2",
|
||||||
|
"util": "^0.12.5",
|
||||||
|
"webpack": "^5.89.0",
|
||||||
|
"webpack-bundle-analyzer": "^4.10.1",
|
||||||
|
"webpack-cli": "^5.1.4",
|
||||||
|
"webpack-merge": "^5.10.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
16
tsconfig.json
Normal file
16
tsconfig.json
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"outDir": "client/dist",
|
||||||
|
"noImplicitAny": true,
|
||||||
|
"module": "es6",
|
||||||
|
"target": "es6",
|
||||||
|
"jsx": "react",
|
||||||
|
"allowJs": true,
|
||||||
|
"moduleResolution": "node",
|
||||||
|
"rootDir": "client/src",
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"allowSyntheticDefaultImports": true
|
||||||
|
},
|
||||||
|
"include": ["client/src/**/*"],
|
||||||
|
"exclude": ["client/**/*.demo*"]
|
||||||
|
}
|
|
@ -1,20 +0,0 @@
|
||||||
import { defineConfig } from 'vite'
|
|
||||||
import react from '@vitejs/plugin-react'
|
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
plugins: [react()],
|
|
||||||
root: 'client',
|
|
||||||
build: {
|
|
||||||
outDir: '../static',
|
|
||||||
},
|
|
||||||
server: {
|
|
||||||
proxy: {
|
|
||||||
'/cosmos/api': {
|
|
||||||
target: 'https://localhost:8443',
|
|
||||||
secure: false,
|
|
||||||
ws: true,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
84
webpack.config.js
Normal file
84
webpack.config.js
Normal file
|
@ -0,0 +1,84 @@
|
||||||
|
const { IgnorePlugin } = require("webpack")
|
||||||
|
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
|
||||||
|
const TerserPlugin = require("terser-webpack-plugin");
|
||||||
|
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||||
|
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
|
||||||
|
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
|
||||||
|
const path = require('path');
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
entry: './client/src/index',
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /\.(ts|tsx)$/,
|
||||||
|
use: 'ts-loader',
|
||||||
|
exclude: /node_modules/,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.(js|jsx)$/,
|
||||||
|
use: "babel-loader",
|
||||||
|
exclude: /node_modules/,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.s[ac]ss$/i,
|
||||||
|
use: [
|
||||||
|
MiniCssExtractPlugin.loader,
|
||||||
|
{ loader: "css-loader", options: { modules: true } },
|
||||||
|
"sass-loader",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.css$/i,
|
||||||
|
use: ["style-loader", { loader: "css-loader", options: { modules: true } },],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
test: /\.(jpe?g|png|gif|svg)$/i,
|
||||||
|
loader: 'file-loader',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
},
|
||||||
|
resolve: {
|
||||||
|
extensions: ['.*', '.tsx', '.ts', '.jsx', '.js'],
|
||||||
|
fallback: {
|
||||||
|
"stream": require.resolve("stream-browserify"),
|
||||||
|
"crypto": require.resolve("crypto-browserify"),
|
||||||
|
"path": require.resolve("path-browserify"),
|
||||||
|
"fs": require.resolve("browserify-fs"),
|
||||||
|
"buffer": require.resolve("buffer/"),
|
||||||
|
"util": require.resolve("util/"),
|
||||||
|
}
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new IgnorePlugin({
|
||||||
|
resourceRegExp: /[\d\D]*.demo[\d\D]*/
|
||||||
|
}),
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: path.join(__dirname, "client", "index.html"),
|
||||||
|
}),
|
||||||
|
new BundleAnalyzerPlugin(),
|
||||||
|
],
|
||||||
|
output: {
|
||||||
|
path: path.resolve(__dirname, 'client/dist'),
|
||||||
|
},
|
||||||
|
optimization: {
|
||||||
|
chunkIds: "total-size",
|
||||||
|
moduleIds: "size",
|
||||||
|
mergeDuplicateChunks: true,
|
||||||
|
portableRecords: true,
|
||||||
|
sideEffects: true,
|
||||||
|
minimizer: [
|
||||||
|
new CssMinimizerPlugin(),
|
||||||
|
new TerserPlugin({
|
||||||
|
minify: TerserPlugin.swcMinify,
|
||||||
|
parallel: true,
|
||||||
|
extractComments: "all",
|
||||||
|
terserOptions: {
|
||||||
|
mangle: true,
|
||||||
|
compress: true,
|
||||||
|
sourceMap: false,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
Loading…
Reference in a new issue