🎉 init:
This commit is contained in:
commit
bdaa469836
|
|
@ -0,0 +1 @@
|
|||
VITE_BASE_API_URL=/dev
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
module.exports = {
|
||||
root: true,
|
||||
env: { browser: true, es2020: true },
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:react-hooks/recommended',
|
||||
],
|
||||
ignorePatterns: ['dist', '.eslintrc.cjs'],
|
||||
parser: '@typescript-eslint/parser',
|
||||
plugins: ['react-refresh'],
|
||||
rules: {
|
||||
'react-refresh/only-export-components': [
|
||||
'warn',
|
||||
{ allowConstantExport: true },
|
||||
],
|
||||
},
|
||||
}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
Binary file not shown.
|
|
@ -0,0 +1 @@
|
|||
nodeLinker: node-modules
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
# React + TypeScript + Vite
|
||||
|
||||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
|
||||
|
||||
Currently, two official plugins are available:
|
||||
|
||||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
|
||||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
||||
|
||||
## Expanding the ESLint configuration
|
||||
|
||||
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
|
||||
|
||||
- Configure the top-level `parserOptions` property like this:
|
||||
|
||||
```js
|
||||
export default {
|
||||
// other rules...
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest',
|
||||
sourceType: 'module',
|
||||
project: ['./tsconfig.json', './tsconfig.node.json'],
|
||||
tsconfigRootDir: __dirname,
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
|
||||
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
|
||||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"symbol_url": "请参考README.md，复制官网提供的JS链接",
|
||||
"use_typescript": false,
|
||||
"save_dir": "./src/components/iconfont",
|
||||
"trim_icon_prefix": "icon",
|
||||
"unit": "px",
|
||||
"default_icon_size": 18
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!--
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:20:03
|
||||
* @LastEditTime: 2024-06-18 10:51:36
|
||||
* @Author: John
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0,maximum-scale=1, minimum-scale=1, user-scalable=no"
|
||||
/>
|
||||
<title>red devils</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
{
|
||||
"name": "red-devils",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview",
|
||||
"iconfont": "npx iconfont-h5"
|
||||
},
|
||||
"dependencies": {
|
||||
"@hyper-fetch/core": "^5.7.5",
|
||||
"@hyper-fetch/react": "^5.7.5",
|
||||
"@tanstack/react-query": "^5.45.1",
|
||||
"@web3modal/wagmi": "^5.0.2",
|
||||
"antd-mobile": "^5.36.1",
|
||||
"i18next": "^23.11.5",
|
||||
"normalize.css": "^8.0.1",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-i18next": "^14.1.2",
|
||||
"react-router-dom": "^6.23.1",
|
||||
"viem": "^2.14.2",
|
||||
"wagmi": "^2.10.2",
|
||||
"zustand": "^4.5.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.14.2",
|
||||
"@types/postcss-pxtorem": "^6",
|
||||
"@types/react": "^18.2.66",
|
||||
"@types/react-dom": "^18.2.22",
|
||||
"@typescript-eslint/eslint-plugin": "^7.2.0",
|
||||
"@typescript-eslint/parser": "^7.2.0",
|
||||
"@vitejs/plugin-react": "^4.2.1",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.6",
|
||||
"postcss": "^8.4.38",
|
||||
"postcss-pxtorem": "5.1.1",
|
||||
"react-iconfont-cli": "^2.0.2",
|
||||
"typescript": "^5.2.2",
|
||||
"vite": "^5.2.0",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
"vite-plugin-node-polyfills": "^0.22.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 18:25:10
|
||||
* @LastEditTime: 2024-06-17 18:45:37
|
||||
* @Author: John
|
||||
*/
|
||||
export default {
|
||||
plugins: {
|
||||
autoprefixer: {},
|
||||
"postcss-pxtorem": {
|
||||
rootValue: 37.5,
|
||||
propList: ["*"],
|
||||
exclude: (e) => {
|
||||
if (/.module\.css$/.test(e)) {
|
||||
console.log(e);
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.5 KiB |
|
|
@ -0,0 +1,4 @@
|
|||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:20:03
|
||||
* @LastEditTime: 2024-06-17 17:36:20
|
||||
* @Author: John
|
||||
*/
|
||||
import { Route, Routes } from "react-router-dom";
|
||||
import "./App.css";
|
||||
import Home from "./pages/Home";
|
||||
function App() {
|
||||
return (
|
||||
<>
|
||||
<Routes>
|
||||
<Route path="/" element={<Home />} />
|
||||
</Routes>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
|
|
@ -0,0 +1,103 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 18:01:43
|
||||
* @LastEditTime: 2024-06-17 18:16:57
|
||||
* @Author: John
|
||||
*/
|
||||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 18:01:43
|
||||
* @LastEditTime: 2024-06-17 18:05:15
|
||||
* @Author: John
|
||||
*/
|
||||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-03-06 11:26:45
|
||||
* @LastEditTime: 2024-05-27 16:32:26
|
||||
* @Author: John
|
||||
*/
|
||||
import { createWeb3Modal } from "@web3modal/wagmi/react";
|
||||
import { defaultWagmiConfig } from "@web3modal/wagmi/react/config";
|
||||
|
||||
import { WagmiProvider } from "wagmi";
|
||||
import { bsc } from "wagmi/chains";
|
||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
import { bnbTestNetwork } from "@/constants/wallet";
|
||||
import { PropsWithChildren } from "react";
|
||||
|
||||
// 0. Setup queryClient
|
||||
const queryClient = new QueryClient();
|
||||
|
||||
// 1. Get projectId at https://cloud.walletconnect.com
|
||||
const projectId = "10834bf2b5d92d012e4b0b05e1150246";
|
||||
|
||||
// 2. Create wagmiConfig
|
||||
const metadata = {
|
||||
name: "red-devils",
|
||||
description: "red devils dapp",
|
||||
url: import.meta.env.BASE_URL, // origin must match your domain & subdomain
|
||||
icons: [`${import.meta.env.BASE_URL}/favicon.svg`],
|
||||
};
|
||||
|
||||
let chains = import.meta.env.PROD
|
||||
? ([bsc] as const)
|
||||
: ([bnbTestNetwork] as const);
|
||||
|
||||
export const config = defaultWagmiConfig({
|
||||
chains, // required
|
||||
projectId, // required
|
||||
metadata, // required
|
||||
enableWalletConnect: true, // Optional - true by default
|
||||
enableInjected: true, // Optional - true by default
|
||||
enableEIP6963: true, // Optional - true by default
|
||||
enableCoinbase: false, // Optional - true by default
|
||||
multiInjectedProviderDiscovery: true,
|
||||
});
|
||||
|
||||
// console.log(window.ethereum);
|
||||
// 3. Create modal
|
||||
createWeb3Modal({
|
||||
wagmiConfig: config,
|
||||
projectId,
|
||||
themeVariables: {
|
||||
"--w3m-accent": "#ea6d28",
|
||||
},
|
||||
featuredWalletIds: [
|
||||
...(window.ethereum
|
||||
? []
|
||||
: ["c57ca95b47569778a828d19178114f4db188b89b763c899ba0be274e97267d96"]),
|
||||
...(window.okxwallet
|
||||
? []
|
||||
: ["971e689d0a5be527bac79629b4ee9b925e82208e5168b733496a09c0faed0709"]),
|
||||
...(window.bitkeep?.ethereum
|
||||
? []
|
||||
: ["38f5d18bd8522c244bdd70cb4a68e0e718865155811c043f052fb9f1c51de662"]),
|
||||
...(window.ethereum?.isTokenPocket
|
||||
? []
|
||||
: ["20459438007b75f4f4acb98bf29aa3b800550309646d375da5fd4aac6c2a2c66"]),
|
||||
],
|
||||
allWallets: "HIDE",
|
||||
});
|
||||
|
||||
export function WalletProvider({ children }: PropsWithChildren) {
|
||||
return (
|
||||
<>
|
||||
<WagmiProvider config={config}>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
{children}
|
||||
</QueryClientProvider>
|
||||
</WagmiProvider>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
ethereum?: { isTokenPocket?: boolean };
|
||||
okxwallet: {
|
||||
bitcoin: any;
|
||||
};
|
||||
unisat: any;
|
||||
bitkeep?: { ethereum?: any };
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:57:13
|
||||
* @LastEditTime: 2024-06-17 17:57:30
|
||||
* @Author: John
|
||||
*/
|
||||
export enum ASYNC_STORAGE_KEY {
|
||||
Token = "user.token",
|
||||
}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
import { defineChain } from "viem/utils";
|
||||
|
||||
export const bnbTestNetwork = defineChain({
|
||||
id: 97,
|
||||
name: "BNB-test",
|
||||
nativeCurrency: {
|
||||
name: "tBNB",
|
||||
symbol: "tBNB",
|
||||
decimals: 18,
|
||||
},
|
||||
rpcUrls: {
|
||||
default: {
|
||||
http: ["https://data-seed-prebsc-1-s3.binance.org:8545"],
|
||||
webSocket: undefined,
|
||||
},
|
||||
},
|
||||
blockExplorers: {
|
||||
default: {
|
||||
name: "BNB-test",
|
||||
url: "https://testnet.bscscan.com",
|
||||
},
|
||||
},
|
||||
testnet: true,
|
||||
});
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:37:21
|
||||
* @LastEditTime: 2024-06-18 09:54:18
|
||||
* @Author: John
|
||||
*/
|
||||
import { createContext, useContext, useState, PropsWithChildren } from "react";
|
||||
|
||||
type EventName = "TEST";
|
||||
export type EventCallBackData = {
|
||||
TEST: {};
|
||||
};
|
||||
// 定义事件的类型
|
||||
type EventType = {
|
||||
[eventName in EventName]?: ((data: EventCallBackData[EventName]) => void)[];
|
||||
};
|
||||
|
||||
// 定义事件总线上下文的类型
|
||||
type EventBusContextType = {
|
||||
subscribe: <T extends EventName>(
|
||||
eventName: T,
|
||||
callback: (data: EventCallBackData[T]) => void
|
||||
) => void;
|
||||
unsubscribe: <T extends EventName>(
|
||||
eventName: T,
|
||||
callback: (data: EventCallBackData[T]) => void
|
||||
) => void;
|
||||
emit: <T extends EventName>(eventName: T, data: EventCallBackData[T]) => void;
|
||||
};
|
||||
|
||||
const EventBusContext = createContext<EventBusContextType | undefined>(
|
||||
undefined
|
||||
);
|
||||
|
||||
export const useEventBus = () => {
|
||||
const context = useContext(EventBusContext);
|
||||
if (!context) {
|
||||
throw new Error("useEventBus must be used within an EventBusProvider");
|
||||
}
|
||||
return context;
|
||||
};
|
||||
|
||||
const EventBusProvider = ({ children }: PropsWithChildren) => {
|
||||
const [events, setEvents] = useState<EventType>({});
|
||||
|
||||
const subscribe = (eventName: EventName, callback: (data: any) => void) => {
|
||||
setEvents((prevEvents) => ({
|
||||
...prevEvents,
|
||||
[eventName]: [...(prevEvents[eventName] || []), callback],
|
||||
}));
|
||||
};
|
||||
|
||||
const unsubscribe = (eventName: EventName, callback: (data: any) => void) => {
|
||||
setEvents((prevEvents) => ({
|
||||
...prevEvents,
|
||||
[eventName]: prevEvents[eventName]?.filter((cb) => cb !== callback),
|
||||
}));
|
||||
};
|
||||
|
||||
const emit = (eventName: EventName, data: any) => {
|
||||
const eventCallbacks = events[eventName] || [];
|
||||
eventCallbacks.forEach((callback) => callback(data));
|
||||
};
|
||||
|
||||
const eventBusContextValue: EventBusContextType = {
|
||||
subscribe,
|
||||
unsubscribe,
|
||||
emit,
|
||||
};
|
||||
|
||||
return (
|
||||
<EventBusContext.Provider value={eventBusContextValue}>
|
||||
{children}
|
||||
</EventBusContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export default EventBusProvider;
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-18 10:30:43
|
||||
* @LastEditTime: 2024-06-18 10:34:19
|
||||
* @Author: John
|
||||
*/
|
||||
import i18next from "i18next";
|
||||
import { initReactI18next } from "react-i18next";
|
||||
import en from "./translation/en.json";
|
||||
i18next.use(initReactI18next).init({
|
||||
compatibilityJSON: "v3", // <--- add this line.
|
||||
lng: "en", // if you're using a language detector, do not define the lng option
|
||||
// lng: LANGUAGE["en-US"],
|
||||
debug: false,
|
||||
resources: {
|
||||
en: {
|
||||
translation: en,
|
||||
},
|
||||
},
|
||||
// if you see an error like: "Argument of type 'DefaultTFuncReturn' is not assignable to parameter of type xyz"
|
||||
// set returnNull to false (and also in the i18next.d.ts options)
|
||||
// returnNull: false,
|
||||
});
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"AppName": "red devils"
|
||||
}
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:20:03
|
||||
* @LastEditTime: 2024-06-18 10:46:11
|
||||
* @Author: John
|
||||
*/
|
||||
import "@/i18n/init.ts";
|
||||
import "antd-mobile/es/global";
|
||||
import ReactDOM from "react-dom/client";
|
||||
import App from "./App.tsx";
|
||||
import "normalize.css";
|
||||
import "./index.css";
|
||||
import { HashRouter } from "react-router-dom";
|
||||
import EventBusProvider from "./context/EventBusContext.tsx";
|
||||
import { WalletProvider } from "./components/WalletProvider.tsx";
|
||||
import flexible from "./utils/flexible.ts";
|
||||
|
||||
flexible(window, document);
|
||||
ReactDOM.createRoot(document.getElementById("root")!).render(
|
||||
<>
|
||||
<WalletProvider>
|
||||
<EventBusProvider>
|
||||
<HashRouter>
|
||||
<App />
|
||||
</HashRouter>
|
||||
</EventBusProvider>
|
||||
</WalletProvider>
|
||||
</>
|
||||
);
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
.Home {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
.text {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
import classes from "./Home.module.css";
|
||||
import useUserStore from "@/store/User";
|
||||
import { copyText } from "@/utils";
|
||||
import { useWeb3Modal } from "@web3modal/wagmi/react";
|
||||
import Button from "antd-mobile/es/components/button";
|
||||
import { useEffect } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
export default function () {
|
||||
const { Token, UpdateToken } = useUserStore();
|
||||
const { open } = useWeb3Modal();
|
||||
const { t } = useTranslation();
|
||||
useEffect(() => {
|
||||
UpdateToken("user token abc");
|
||||
|
||||
return () => {};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
console.log("user token:", Token);
|
||||
|
||||
return () => {};
|
||||
}, [Token]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className={classes.Home}>
|
||||
<span className={classes.text}>{t("AppName")}</span>
|
||||
<Button
|
||||
onClick={() => {
|
||||
open();
|
||||
}}
|
||||
>
|
||||
Connect Wallet
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
onClick={() => {
|
||||
copyText("123");
|
||||
}}
|
||||
>
|
||||
copy text
|
||||
</Button>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-18 10:09:21
|
||||
* @LastEditTime: 2024-06-18 10:27:04
|
||||
* @Author: John
|
||||
*/
|
||||
import { Client } from "@hyper-fetch/core";
|
||||
import { BASE_RESPONSE } from "./module";
|
||||
|
||||
const client = new Client({ url: import.meta.env.VITE_BASE_API_URL })
|
||||
.onAuth((req) => {
|
||||
return req;
|
||||
})
|
||||
.onRequest((req) => {
|
||||
req.setHeaders({});
|
||||
return req;
|
||||
})
|
||||
.onResponse((res) => {
|
||||
return res;
|
||||
});
|
||||
|
||||
export const POST = <P, R = any>({ url }: { url: string }) => {
|
||||
return client.createRequest<BASE_RESPONSE<R>, P>()({
|
||||
method: "POST",
|
||||
endpoint: url,
|
||||
});
|
||||
};
|
||||
|
||||
export const GET = <P, R = any>({ url }: { url: string }) => {
|
||||
return client.createRequest<BASE_RESPONSE<R>, any, any, P>()({
|
||||
method: "GET",
|
||||
endpoint: url,
|
||||
});
|
||||
};
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
export type BASE_RESPONSE<T = any> = {
|
||||
code: 0 | 200;
|
||||
data: T | null;
|
||||
msg: string;
|
||||
timeMillis: number;
|
||||
}; // What's returned from request
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:45:43
|
||||
* @LastEditTime: 2024-06-17 17:57:42
|
||||
* @Author: John
|
||||
*/
|
||||
import { ASYNC_STORAGE_KEY } from "@/constants";
|
||||
import { create } from "zustand";
|
||||
import { createJSONStorage, persist } from "zustand/middleware";
|
||||
|
||||
interface UserState {
|
||||
Token: string;
|
||||
UpdateToken: (t: string) => void;
|
||||
}
|
||||
|
||||
export const useUserStore = create<UserState>()(
|
||||
persist(
|
||||
(set, _get) => ({
|
||||
Token: "",
|
||||
UpdateToken: (t) => set({ Token: t }),
|
||||
}),
|
||||
{
|
||||
name: ASYNC_STORAGE_KEY.Token, // name of item in the storage (must be unique)
|
||||
storage: createJSONStorage(() => localStorage), // (optional) by default the 'localStorage' is used
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
export default useUserStore;
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-01-23 10:39:17
|
||||
* @LastEditTime: 2024-06-18 10:35:21
|
||||
* @Author: John
|
||||
*/
|
||||
// import the original type declarations
|
||||
import "i18next";
|
||||
// import all namespaces (for the default language, only)
|
||||
import en from "../i18n/translation/en.json";
|
||||
|
||||
declare module "i18next" {
|
||||
// Extend CustomTypeOptions
|
||||
interface CustomTypeOptions {
|
||||
// custom namespace type, if you changed it
|
||||
defaultNS: "en";
|
||||
// custom resources type
|
||||
resources: {
|
||||
en: typeof en;
|
||||
};
|
||||
// other
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-01-09 09:34:24
|
||||
* @LastEditTime: 2024-06-17 18:37:01
|
||||
* @Author: John
|
||||
*/
|
||||
|
||||
export default function flexible(window: Window, document: Document) {
|
||||
var docEl = document.documentElement;
|
||||
var dpr = window.devicePixelRatio || 1;
|
||||
|
||||
// adjust body font size
|
||||
function setBodyFontSize() {
|
||||
if (document.body) {
|
||||
document.body.style.fontSize = 12 * dpr + "px";
|
||||
} else {
|
||||
document.addEventListener("DOMContentLoaded", setBodyFontSize);
|
||||
}
|
||||
}
|
||||
setBodyFontSize();
|
||||
|
||||
// set 1rem = viewWidth / 10
|
||||
function setRemUnit() {
|
||||
var rem = docEl.clientWidth / 10;
|
||||
// console.log("rem:", rem);
|
||||
docEl.style.fontSize = rem + "px";
|
||||
}
|
||||
|
||||
setRemUnit();
|
||||
|
||||
// reset rem unit on page resize
|
||||
window.addEventListener("resize", setRemUnit);
|
||||
window.addEventListener("pageshow", function (e) {
|
||||
if (e.persisted) {
|
||||
setRemUnit();
|
||||
}
|
||||
});
|
||||
|
||||
// detect 0.5px supports
|
||||
if (dpr >= 2) {
|
||||
var fakeBody = document.createElement("body");
|
||||
var testElement = document.createElement("div");
|
||||
testElement.style.border = ".5px solid transparent";
|
||||
fakeBody.appendChild(testElement);
|
||||
docEl.appendChild(fakeBody);
|
||||
if (testElement.offsetHeight === 1) {
|
||||
docEl.classList.add("hairlines");
|
||||
}
|
||||
docEl.removeChild(fakeBody);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,79 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 18:19:27
|
||||
* @LastEditTime: 2024-06-18 10:48:05
|
||||
* @Author: John
|
||||
*/
|
||||
|
||||
import Toast from "antd-mobile/es/components/toast";
|
||||
|
||||
export const ua = navigator.userAgent;
|
||||
export const isIOS = /iphone|ipad|ipod|ios/i.test(ua);
|
||||
export const isAndroid = /android|XiaoMi|MiuiBrowser/i.test(ua);
|
||||
export const isMobile = isIOS || isAndroid;
|
||||
export const isOKApp = /OKApp/i.test(ua);
|
||||
|
||||
export function shortenString(
|
||||
inputString: string,
|
||||
startLength: number,
|
||||
endLength: number
|
||||
) {
|
||||
if (inputString.length <= startLength + endLength) {
|
||||
return inputString; // 如果字符串长度小于等于要保留的前后字符数之和，直接返回原字符串
|
||||
}
|
||||
|
||||
const startPart = inputString.slice(0, startLength);
|
||||
const endPart = inputString.slice(-endLength);
|
||||
|
||||
return `${startPart}...${endPart}`;
|
||||
}
|
||||
|
||||
// 定义一个函数，用于获取指定参数的值
|
||||
export function getUrlQueryParam(key: string): string | undefined {
|
||||
console.log(window.location);
|
||||
const query: Map<string, string> = new Map();
|
||||
const queryStr = window.location.href.split("?")[1];
|
||||
if (queryStr) {
|
||||
const queryStrArr = queryStr.split("&");
|
||||
queryStrArr.forEach((v) => {
|
||||
const queryArr = v.split("=");
|
||||
query.set(queryArr[0], queryArr[1]);
|
||||
});
|
||||
}
|
||||
return query.get(key);
|
||||
}
|
||||
|
||||
export function copyText(text: string) {
|
||||
const value = text;
|
||||
// 1、创建DOM input框
|
||||
const input = document.createElement("input");
|
||||
// 2、隐藏input
|
||||
input.setAttribute(
|
||||
"style",
|
||||
`
|
||||
opacity: 0;
|
||||
z-index: 999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
`
|
||||
);
|
||||
|
||||
// 3、将指定文本赋值给input
|
||||
input.value = value;
|
||||
// 4、将input插入文档
|
||||
document.body.appendChild(input);
|
||||
// 5、选中文本
|
||||
// @ts-ignore
|
||||
input.select();
|
||||
// 6、复制到剪切板
|
||||
const isCopySuccess = document.execCommand("copy");
|
||||
|
||||
// 7、复制成功后提示
|
||||
isCopySuccess &&
|
||||
Toast.show({
|
||||
icon: "success",
|
||||
content: "Copy successful",
|
||||
});
|
||||
// 8、 销毁DOM
|
||||
document.body.removeChild(input);
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
/// <reference types="vite/client" />
|
||||
|
||||
interface ImportMetaEnv {
|
||||
readonly VITE_BASE_API_URL: string;
|
||||
// 更多环境变量...
|
||||
readonly MODE: "development" | "production" | "test";
|
||||
}
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
/*
|
||||
* @LastEditors: John
|
||||
* @Date: 2024-06-17 17:20:03
|
||||
* @LastEditTime: 2024-06-17 17:41:09
|
||||
* @Author: John
|
||||
*/
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Linting */
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
import { defineConfig } from "vite";
|
||||
import react from "@vitejs/plugin-react";
|
||||
import path from "path";
|
||||
import viteCompression from "vite-plugin-compression";
|
||||
import { nodePolyfills } from "vite-plugin-node-polyfills";
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
react(),
|
||||
viteCompression({ deleteOriginFile: false }),
|
||||
nodePolyfills(),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": path.resolve(__dirname, "./src"),
|
||||
},
|
||||
},
|
||||
css: {},
|
||||
});
|
||||
Loading…
Reference in New Issue