Skip to content

Commit

Permalink
basepath
Browse files Browse the repository at this point in the history
  • Loading branch information
wangqianwen0418 committed Aug 7, 2024
1 parent d4f8232 commit 1c6bed0
Show file tree
Hide file tree
Showing 7 changed files with 127 additions and 6 deletions.
1 change: 1 addition & 0 deletions src/.env
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
REACT_APP_BASE_URL=""
1 change: 1 addition & 0 deletions src/.env.production
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
REACT_APP_BASE_URL="/interactive-survey-template/"
4 changes: 2 additions & 2 deletions src/Papers/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
Typography,
} from "@material-ui/core";
import AvatarGroup from '@material-ui/lab/AvatarGroup';
import { Paper as TPaper } from "../index";
import { Paper as TPaper, basePath } from "../index";
import { getAvatar } from "../SideBar";
import { useStyles } from "./style";
import { getAllTags } from '../index';
Expand Down Expand Up @@ -56,7 +56,7 @@ export function Papers(props: Props) {


const AvatarComponent = ({ tag, bgcolor }) => {
const avatarSrc = `${window.location.origin}/assets/avatars/${tag.replace(' ', '_')}_w.png`;
const avatarSrc = `${basePath}/assets/avatars/${tag.replace(' ', '_')}_w.png`;
return (
<Avatar alt={getAvatar(tag)} src={avatarSrc} style={{ width: 24, height: 24, backgroundColor: bgcolor, color: "white" }}><b style={{ fontSize: '0.75rem' }}>{getAvatar(tag)}</b></Avatar>
);
Expand Down
3 changes: 2 additions & 1 deletion src/SideBar/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import { useStyles } from "./style";

import { ChartModal } from '../ChartModal'
import { List } from "echarts";
import { basePath } from "..";

export const getAvatar = (s: string) => {
const pieces = s.split(" ");
Expand Down Expand Up @@ -80,7 +81,7 @@ export function SideBar(props: Props) {


const AvatarComponent = ({ tag, bgcolor, typeName }) => {
const avatarSrc = `${window.location.origin}/assets/avatars/${typeName}_${tag}.png`;
const avatarSrc = `${basePath}/assets/avatars/${typeName}_${tag}.png`;
// console.log("getAvatar(tag): ", getAvatar(tag))
return (
<Avatar alt={getAvatar(tag)} src={avatarSrc} style={{ width: 24, height: 24, marginLeft: 6, backgroundColor: bgcolor, color: "white", border: "1px solid white" }}><b style={{ fontSize: '0.75rem' }}>{getAvatar(tag)}</b></Avatar>
Expand Down
5 changes: 3 additions & 2 deletions src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,9 @@ import { Papers } from "./Papers";
import { SideBar } from "./SideBar";

import { useStyles, theme } from "./style";
import { use } from "echarts";

export const basePath = process.env.REACT_APP_BASE_URL || ''


//Use tags dynamically
let allTags = {};
Expand Down Expand Up @@ -62,7 +64,6 @@ export default function App() {
// const menuId = "primary-search-account-menu";

const fetchData = async (version: string) => {
const basePath = window.location.origin
const response = await fetch(`${basePath}/assets/${version}.json`);
const res = await response.json();
const { papers, title, colors, preprint, homepage, topTheme } = res;
Expand Down
6 changes: 5 additions & 1 deletion webpack.config.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
const path = require('path')
const webpack = require('webpack');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const TerserJSPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
Expand Down Expand Up @@ -36,7 +37,10 @@ module.exports = {
filename: `index.html`,
template: path.resolve(__dirname, `./src/index.html`),
chunks: ['index'],
})
}),
new webpack.DefinePlugin({
'process.env.REACT_APP_BASE_URL': JSON.stringify(process.env.REACT_APP_BASE_URL)
})
],
optimization: {
usedExports: true,
Expand Down
113 changes: 113 additions & 0 deletions webpack.prod.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
const path = require('path')
const webpack = require('webpack');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const TerserJSPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin')


module.exports = {
// devtool: 'inline-source-map',
devtool: 'source-map',
mode: 'production',
devServer: {
contentBase: [path.join(__dirname, 'videos'), path.join(__dirname, 'assets')],
contentBasePublicPath: ['/videos', '/assets'],
compress: true,
hot: true,
host: '0.0.0.0',
// disableHostCheck: true,
port: 21002
},
entry: {
index: path.resolve(__dirname, './src/index.tsx'),
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].[contenthash].css'
}),
new CleanWebpackPlugin({
cleanOnceBeforeBuildPatterns: ['**/*', '!data', '!data/**/*', '!.git', '!.git/**/*'],
cleanStaleWebpackAssets: false,
verbose: true
}),
new HtmlWebpackPlugin({
title: 'ML4VIS',
filename: `index.html`,
template: path.resolve(__dirname, `./src/index.html`),
chunks: ['index'],
}),
new webpack.DefinePlugin({
'process.env.REACT_APP_BASE_URL': JSON.stringify(process.env.REACT_APP_BASE_URL)
})
],
optimization: {
usedExports: true,
minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})],
splitChunks: {
cacheGroups: {
styles: {
name: 'styles',
test: /\.css$/,
chunks: 'all',
enforce: true,
},
},
},
},
module: {
rules: [
{
test: /\.(ts|js|tsx)$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: [
['@babel/preset-env', { useBuiltIns: "usage", corejs: { version: 3, proposals: true }, targets: "last 2 versions and > 1%" }],
"@babel/preset-typescript",
"@babel/preset-react"
],
plugins: [
"@babel/plugin-proposal-class-properties",
]
}
}
},
{
test: /\.css$/,
exclude: /(node_modules|bower_components)/,
use: [
MiniCssExtractPlugin.loader,
'css-loader'
]
},
{
test: /\.less$/,
exclude: /(node_modules|bower_components)/,
use: [
// MiniCssExtractPlugin.loader,
'style-loader',
'css-loader',
'less-loader'
]
}
]
},
resolve: {
extensions: [
'.ts', '.js', '.tsx'
]
},
output: {
filename: '[name].[contenthash].js',
// path: path.resolve(__dirname, '../../vislang@public'),
// path: path.resolve(__dirname, '../public')
},

output: {
path: path.resolve(__dirname, 'dist')
},

}

0 comments on commit 1c6bed0

Please sign in to comment.