aboutsummaryrefslogtreecommitdiff
path: root/Timeline/ClientApp
diff options
context:
space:
mode:
Diffstat (limited to 'Timeline/ClientApp')
-rw-r--r--Timeline/ClientApp/.gitignore9
-rw-r--r--Timeline/ClientApp/.yarnrc.yml1
-rw-r--r--Timeline/ClientApp/README.md16
-rw-r--r--Timeline/ClientApp/package.json4
-rw-r--r--Timeline/ClientApp/webpack.common.ts28
-rw-r--r--Timeline/ClientApp/webpack.config.dev.ts35
-rw-r--r--Timeline/ClientApp/webpack.config.prod.ts31
7 files changed, 61 insertions, 63 deletions
diff --git a/Timeline/ClientApp/.gitignore b/Timeline/ClientApp/.gitignore
index e7a6cf65..cf6c0813 100644
--- a/Timeline/ClientApp/.gitignore
+++ b/Timeline/ClientApp/.gitignore
@@ -2,8 +2,11 @@
# dependencies
/node_modules
-/.pnp
-.pnp.js
+
+.yarn/*
+!.yarn/cache
+!.yarn/releases
+!.yarn/plugins
# testing
/coverage
@@ -24,4 +27,4 @@ yarn-error.log*
.vscode
-dist \ No newline at end of file
+/dist \ No newline at end of file
diff --git a/Timeline/ClientApp/.yarnrc.yml b/Timeline/ClientApp/.yarnrc.yml
new file mode 100644
index 00000000..5614d154
--- /dev/null
+++ b/Timeline/ClientApp/.yarnrc.yml
@@ -0,0 +1 @@
+yarnPath: ".yarn/releases/yarn-berry.js"
diff --git a/Timeline/ClientApp/README.md b/Timeline/ClientApp/README.md
deleted file mode 100644
index 9b265493..00000000
--- a/Timeline/ClientApp/README.md
+++ /dev/null
@@ -1,16 +0,0 @@
-# Welcome to Timeline!
-
-[![Build Status](https://dev.azure.com/crupest-web/Timeline/_apis/build/status/crupest.Timeline-React?branchName=master)](https://dev.azure.com/crupest-web/Timeline/_build/latest?definitionId=8&branchName=master)
-[![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=crupest/Timeline-React)](https://dependabot.com)
-
-This is the first web app front-end of [me](https://github.com/crupest).
-
-It is written with [React](https://reactjs.org/) and [Typescript](https://www.typescriptlang.org/).
-
-The final product is hosting on my [Tencent Cloud](https://cloud.tencent.com/) Cloud Virtual Machine on https://www.crupest.xyz.
-
-Feel free to comment by opening an issue.
-
-### jibber-jabber
-
-I used to write the website with Angular, you can find the old project [here](https://github.com/crupest/Timeline-App), in which I build full unit tests and CI/CD. But I finally gave up for the complexity. Then I turned to flutter to build an Android app, which can be found [here](https://github.com/crupest/Timeline-Flutter). But as time passed by, it turned out that it is simpler than Angular but still very complicated. In the end, I got here and met React. First I use [Create React App](https://github.com/facebook/create-react-app) to bootstrap this and later turn to manually configured Webpack. I also adopt the [Material-UI](https://material-ui.com/).
diff --git a/Timeline/ClientApp/package.json b/Timeline/ClientApp/package.json
index 11130ccb..f47749b0 100644
--- a/Timeline/ClientApp/package.json
+++ b/Timeline/ClientApp/package.json
@@ -19,6 +19,7 @@
"react-hot-loader": "^4.12.21",
"react-i18next": "^11.5.0",
"react-responsive": "^8.0.3",
+ "react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"reactstrap": "^8.4.1",
"regenerator-runtime": "^0.13.5",
@@ -61,6 +62,7 @@
"@types/react": "^16.9.35",
"@types/react-dom": "^16.9.8",
"@types/react-responsive": "^8.0.2",
+ "@types/react-router": "^5.1.7",
"@types/react-router-dom": "^5.1.5",
"@types/reactstrap": "^8.4.2",
"@types/webpack": "^4.41.14",
@@ -85,7 +87,7 @@
"html-webpack-plugin": "^3.2.0",
"html-webpack-template": "^6.2.0",
"http-server": "^0.12.3",
- "image-webpack-loader": "^6.0.0",
+ "pnp-webpack-plugin": "^1.6.4",
"postcss-loader": "^3.0.0",
"prettier": "^2.0.5",
"sass": "^1.26.7",
diff --git a/Timeline/ClientApp/webpack.common.ts b/Timeline/ClientApp/webpack.common.ts
index 9e7da028..c4e95e54 100644
--- a/Timeline/ClientApp/webpack.common.ts
+++ b/Timeline/ClientApp/webpack.common.ts
@@ -1,11 +1,12 @@
import webpack from 'webpack';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import autoprefixer from 'autoprefixer';
+import htmlWebpackTemplate from 'html-webpack-template';
export const commonRules: webpack.RuleSetRule[] = [
{
test: /\.css$/,
- use: ['style-loader', 'css-loader']
+ use: ['style-loader', 'css-loader'],
},
{
test: /\.(scss)$/,
@@ -15,13 +16,13 @@ export const commonRules: webpack.RuleSetRule[] = [
{
loader: 'postcss-loader',
options: {
- plugins: function() {
+ plugins: function () {
return [autoprefixer];
- }
- }
+ },
+ },
},
- 'sass-loader'
- ]
+ 'sass-loader',
+ ],
},
{
test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot)$/i,
@@ -29,19 +30,16 @@ export const commonRules: webpack.RuleSetRule[] = [
{
loader: 'url-loader',
options: {
- limit: 8192
- }
+ limit: 8192,
+ },
},
- {
- loader: 'image-webpack-loader'
- }
- ]
- }
+ ],
+ },
];
export const htmlCommonConfig: HtmlWebpackPlugin.Options = {
inject: false,
- template: require('html-webpack-template'),
+ template: htmlWebpackTemplate,
appMountId: 'app',
mobile: true,
@@ -55,5 +53,5 @@ export const htmlCommonConfig: HtmlWebpackPlugin.Options = {
<meta name="msapplication-TileColor" content="#2d89ef">
<meta name="theme-color" content="#ffffff">
`,
- title: 'Timeline'
+ title: 'Timeline',
};
diff --git a/Timeline/ClientApp/webpack.config.dev.ts b/Timeline/ClientApp/webpack.config.dev.ts
index 869b963b..17c227b3 100644
--- a/Timeline/ClientApp/webpack.config.dev.ts
+++ b/Timeline/ClientApp/webpack.config.dev.ts
@@ -2,6 +2,7 @@ import path from 'path';
import webpack from 'webpack';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
+import PnpWebpackPlugin from 'pnp-webpack-plugin';
import { commonRules, htmlCommonConfig } from './webpack.common';
@@ -17,16 +18,20 @@ const config: webpack.Configuration = {
exclude: /node_modules/,
loader: 'babel-loader',
options: {
- plugins: ['react-hot-loader/babel']
- }
- }
- ]
+ plugins: ['react-hot-loader/babel'],
+ },
+ },
+ ],
},
resolve: {
alias: {
- 'react-dom': '@hot-loader/react-dom'
+ 'react-dom': '@hot-loader/react-dom',
},
- extensions: ['*', '.js', '.jsx', '.ts', '.tsx']
+ extensions: ['*', '.js', '.jsx', '.ts', '.tsx'],
+ plugins: [PnpWebpackPlugin],
+ },
+ resolveLoader: {
+ plugins: [PnpWebpackPlugin.moduleLoader(module)],
},
optimization: {
runtimeChunk: 'single',
@@ -36,16 +41,16 @@ const config: webpack.Configuration = {
vendor: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
- chunks: 'all'
- }
- }
- }
+ chunks: 'all',
+ },
+ },
+ },
},
output: {
path: path.resolve(__dirname, 'dist/'),
filename: '[name].[hash].js',
chunkFilename: '[name].[hash].js',
- publicPath: '/'
+ publicPath: '/',
},
devServer: {
contentBase: path.join(__dirname, 'public/'),
@@ -53,16 +58,16 @@ const config: webpack.Configuration = {
port: 3000,
publicPath: 'http://localhost:3000/',
historyApiFallback: true,
- hotOnly: true
+ hotOnly: true,
},
plugins: [
new HtmlWebpackPlugin({
...htmlCommonConfig,
- devServer: 'http://localhost:3000'
+ devServer: 'http://localhost:3000',
}),
new ForkTsCheckerWebpackPlugin(),
- new webpack.HotModuleReplacementPlugin()
- ]
+ new webpack.HotModuleReplacementPlugin(),
+ ],
};
export default config;
diff --git a/Timeline/ClientApp/webpack.config.prod.ts b/Timeline/ClientApp/webpack.config.prod.ts
index 77ee7966..f7cb0374 100644
--- a/Timeline/ClientApp/webpack.config.prod.ts
+++ b/Timeline/ClientApp/webpack.config.prod.ts
@@ -4,6 +4,7 @@ import { CleanWebpackPlugin } from 'clean-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
import CopyPlugin from 'copy-webpack-plugin';
+import PnpWebpackPlugin from 'pnp-webpack-plugin';
import { commonRules, htmlCommonConfig } from './webpack.common';
@@ -17,12 +18,16 @@ const config: webpack.Configuration = {
{
test: /\.(js|jsx|ts|tsx)$/,
exclude: /node_modules/,
- loader: 'babel-loader'
- }
- ]
+ loader: 'babel-loader',
+ },
+ ],
},
resolve: {
- extensions: ['*', '.js', '.jsx', '.ts', '.tsx']
+ extensions: ['*', '.js', '.jsx', '.ts', '.tsx'],
+ plugins: [PnpWebpackPlugin],
+ },
+ resolveLoader: {
+ plugins: [PnpWebpackPlugin.moduleLoader(module)],
},
optimization: {
runtimeChunk: 'single',
@@ -32,16 +37,16 @@ const config: webpack.Configuration = {
vendor: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
- chunks: 'all'
- }
- }
- }
+ chunks: 'all',
+ },
+ },
+ },
},
output: {
path: path.resolve(__dirname, 'dist/'),
filename: '[name].[hash].js',
chunkFilename: '[name].[hash].js',
- publicPath: '/'
+ publicPath: '/',
},
plugins: [
new CleanWebpackPlugin(),
@@ -50,10 +55,10 @@ const config: webpack.Configuration = {
new CopyPlugin([
{
from: path.resolve(__dirname, 'public/'),
- to: path.resolve(__dirname, 'dist/')
- }
- ])
- ]
+ to: path.resolve(__dirname, 'dist/'),
+ },
+ ]),
+ ],
};
export default config;
generated by cgit v1.2.3 (git 2.46.0) at 2025-09-28 22:50:39 +0000