fix: add env
This commit is contained in:
parent
b5dde4e823
commit
78d581c98c
@ -4,6 +4,7 @@ import { Page } from '@kevisual/store/page';
|
|||||||
const page = new Page({
|
const page = new Page({
|
||||||
isListen: true,
|
isListen: true,
|
||||||
});
|
});
|
||||||
|
page.basename = '';
|
||||||
page.addPage('/', 'home');
|
page.addPage('/', 'home');
|
||||||
page.addPage('/:id', 'user');
|
page.addPage('/:id', 'user');
|
||||||
page.subscribe(
|
page.subscribe(
|
||||||
@ -21,3 +22,6 @@ page.subscribe('user', (params, state) => {
|
|||||||
// page.navigate('/c', { id: 3 });
|
// page.navigate('/c', { id: 3 });
|
||||||
// page.navigate('/c', { id: 2 });
|
// page.navigate('/c', { id: 2 });
|
||||||
// page.refresh();
|
// page.refresh();
|
||||||
|
|
||||||
|
// @ts-ignore
|
||||||
|
window.page = page;
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@kevisual/store",
|
"name": "@kevisual/store",
|
||||||
"version": "0.0.1-alpha.5",
|
"version": "0.0.1-alpha.7",
|
||||||
"main": "dist/store.js",
|
"main": "dist/store.js",
|
||||||
"module": "dist/store.js",
|
"module": "dist/store.js",
|
||||||
"types": "dist/store.d.ts",
|
"types": "dist/store.d.ts",
|
||||||
@ -23,6 +23,7 @@
|
|||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"description": "",
|
"description": "",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@kevisual/types": "link:../types",
|
||||||
"@rollup/plugin-commonjs": "^28.0.1",
|
"@rollup/plugin-commonjs": "^28.0.1",
|
||||||
"@rollup/plugin-node-resolve": "^15.3.0",
|
"@rollup/plugin-node-resolve": "^15.3.0",
|
||||||
"@rollup/plugin-typescript": "^12.1.1",
|
"@rollup/plugin-typescript": "^12.1.1",
|
||||||
|
@ -30,7 +30,7 @@ export default [
|
|||||||
plugins: [dts()],
|
plugins: [dts()],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
input: 'src/web-config.ts',
|
input: 'src/web-env.ts',
|
||||||
output: {
|
output: {
|
||||||
file: 'dist/web-config.js',
|
file: 'dist/web-config.js',
|
||||||
format: 'es',
|
format: 'es',
|
||||||
@ -38,29 +38,13 @@ export default [
|
|||||||
plugins: [resolve({ browser: true }), commonjs(), typescript()],
|
plugins: [resolve({ browser: true }), commonjs(), typescript()],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
input: 'src/web-config.ts',
|
input: 'src/web-env.ts',
|
||||||
output: {
|
output: {
|
||||||
file: 'dist/web-config.d.ts',
|
file: 'dist/web-config.d.ts',
|
||||||
format: 'es',
|
format: 'es',
|
||||||
},
|
},
|
||||||
plugins: [dts()],
|
plugins: [dts()],
|
||||||
},
|
},
|
||||||
{
|
|
||||||
input: 'src/web-context.ts',
|
|
||||||
output: {
|
|
||||||
file: 'dist/web-context.js',
|
|
||||||
format: 'es',
|
|
||||||
},
|
|
||||||
plugins: [resolve({ browser: true }), commonjs(), typescript()],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
input: 'src/web-context.ts',
|
|
||||||
output: {
|
|
||||||
file: 'dist/web-context.d.ts',
|
|
||||||
format: 'es',
|
|
||||||
},
|
|
||||||
plugins: [dts()],
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
input: 'src/page.ts',
|
input: 'src/page.ts',
|
||||||
output: {
|
output: {
|
||||||
|
@ -2,6 +2,10 @@ import { getPathKey } from '@/utils/path-key.ts';
|
|||||||
import { match } from 'path-to-regexp';
|
import { match } from 'path-to-regexp';
|
||||||
import deepEqual from 'fast-deep-equal';
|
import deepEqual from 'fast-deep-equal';
|
||||||
|
|
||||||
|
const generateRandom = () => {
|
||||||
|
// return Math.random().toString(36).substring(8);
|
||||||
|
return crypto.randomUUID();
|
||||||
|
};
|
||||||
type PageOptions = {
|
type PageOptions = {
|
||||||
path?: string;
|
path?: string;
|
||||||
key?: string;
|
key?: string;
|
||||||
@ -19,6 +23,7 @@ type CallbackInfo = {
|
|||||||
fn: CallFn;
|
fn: CallFn;
|
||||||
id: string;
|
id: string;
|
||||||
} & PageModule;
|
} & PageModule;
|
||||||
|
let currentUrl = location.href;
|
||||||
export class Page {
|
export class Page {
|
||||||
pageModule = new Map<string, PageModule>();
|
pageModule = new Map<string, PageModule>();
|
||||||
// pathname的第一个路径
|
// pathname的第一个路径
|
||||||
@ -40,6 +45,7 @@ export class Page {
|
|||||||
}
|
}
|
||||||
popstate(event?: PopStateEvent, manualOpts?: { id?: string; type: 'singal' | 'all' }) {
|
popstate(event?: PopStateEvent, manualOpts?: { id?: string; type: 'singal' | 'all' }) {
|
||||||
const pathname = window.location.pathname;
|
const pathname = window.location.pathname;
|
||||||
|
console.log('popstate', event);
|
||||||
if (manualOpts) {
|
if (manualOpts) {
|
||||||
if (manualOpts.type === 'singal') {
|
if (manualOpts.type === 'singal') {
|
||||||
const item = this.callbacks.find((item) => item.id === manualOpts.id);
|
const item = this.callbacks.find((item) => item.id === manualOpts.id);
|
||||||
@ -120,7 +126,7 @@ export class Page {
|
|||||||
*/
|
*/
|
||||||
subscribe(key: string, fn?: CallFn, opts?: { pathname?: string; runImmediately?: boolean; id?: string }) {
|
subscribe(key: string, fn?: CallFn, opts?: { pathname?: string; runImmediately?: boolean; id?: string }) {
|
||||||
const runImmediately = opts?.runImmediately ?? true; // 默认立即执行
|
const runImmediately = opts?.runImmediately ?? true; // 默认立即执行
|
||||||
const id = opts?.id ?? Math.random().toString(36).slice(2);
|
const id = opts?.id ?? generateRandom();
|
||||||
const path = this.pageModule.get(key)?.path;
|
const path = this.pageModule.get(key)?.path;
|
||||||
if (!path) {
|
if (!path) {
|
||||||
console.error(`PageModule ${key} not found`);
|
console.error(`PageModule ${key} not found`);
|
||||||
|
@ -1,41 +0,0 @@
|
|||||||
import { getPathKey } from './utils/path-key.ts';
|
|
||||||
|
|
||||||
type GlobalConfig = {
|
|
||||||
name?: string;
|
|
||||||
[key: string]: any;
|
|
||||||
};
|
|
||||||
export const useConfig = (initConfig?: GlobalConfig) => {
|
|
||||||
const config: GlobalConfig = (window as any).config;
|
|
||||||
const _config = config || initConfig;
|
|
||||||
!config && ((window as any)['config'] = _config);
|
|
||||||
return _config;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const useConfigKey = <T>(key: string, init?: () => T): T => {
|
|
||||||
const _config = useConfig({});
|
|
||||||
if (key && init) {
|
|
||||||
_config[key] = init();
|
|
||||||
return _config[key] as any;
|
|
||||||
}
|
|
||||||
if (key) {
|
|
||||||
return _config[key];
|
|
||||||
}
|
|
||||||
return _config as any;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const useConfigKeySync = async <T = any>(key: string, init?: () => Promise<T>): Promise<T> => {
|
|
||||||
const _config = useConfig({});
|
|
||||||
if (key && init) {
|
|
||||||
_config[key] = await init();
|
|
||||||
return _config[key] as any;
|
|
||||||
}
|
|
||||||
if (key) {
|
|
||||||
return _config[key];
|
|
||||||
}
|
|
||||||
return _config as any;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const usePageConfig = (init?: () => {}) => {
|
|
||||||
const { id } = getPathKey();
|
|
||||||
return useConfigKey(id, init);
|
|
||||||
};
|
|
@ -1,41 +0,0 @@
|
|||||||
import { getPathKey } from './utils/path-key.ts';
|
|
||||||
|
|
||||||
type GlobalContext = {
|
|
||||||
name?: string;
|
|
||||||
[key: string]: any;
|
|
||||||
};
|
|
||||||
export const useContext = (initContext?: GlobalContext) => {
|
|
||||||
const context: GlobalContext = (window as any).context;
|
|
||||||
const _context = context || initContext;
|
|
||||||
!context && ((window as any)['context'] = _context);
|
|
||||||
return _context;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const useContextKey = <T>(key: string, init?: () => T): T => {
|
|
||||||
const _context = useContext({});
|
|
||||||
if (key && init) {
|
|
||||||
_context[key] = init();
|
|
||||||
return _context[key] as any;
|
|
||||||
}
|
|
||||||
if (key) {
|
|
||||||
return _context[key];
|
|
||||||
}
|
|
||||||
return _context as any;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const useContextKeySync = async <T = any>(key: string, init?: () => Promise<T>): Promise<T> => {
|
|
||||||
const _context = useContext({});
|
|
||||||
if (key && init) {
|
|
||||||
_context[key] = await init();
|
|
||||||
return _context[key] as any;
|
|
||||||
}
|
|
||||||
if (key) {
|
|
||||||
return _context[key];
|
|
||||||
}
|
|
||||||
return _context as any;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const usePageContext = (init?: () => {}) => {
|
|
||||||
const { id } = getPathKey();
|
|
||||||
return useContextKey(id, init);
|
|
||||||
};
|
|
90
src/web-env.ts
Normal file
90
src/web-env.ts
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
import { getPathKey } from './utils/path-key.ts';
|
||||||
|
|
||||||
|
type GlobalEnv = {
|
||||||
|
name?: string;
|
||||||
|
[key: string]: any;
|
||||||
|
};
|
||||||
|
export const useEnv = (initEnv?: GlobalEnv, initKey = 'config') => {
|
||||||
|
const env: GlobalEnv = (window as any)[initKey];
|
||||||
|
const _env = env || initEnv;
|
||||||
|
if (!env) {
|
||||||
|
if (_env) {
|
||||||
|
(window as any)[initKey] = _env;
|
||||||
|
} else {
|
||||||
|
(window as any)[initKey] = {};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return window[initKey] as GlobalEnv;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useEnvKey = <T = any>(key: string, init?: () => T | null, initKey = 'config'): T => {
|
||||||
|
const _env = useEnv({}, initKey);
|
||||||
|
if (key && _env[key]) {
|
||||||
|
return _env[key];
|
||||||
|
}
|
||||||
|
if (key && init) {
|
||||||
|
_env[key] = init();
|
||||||
|
return _env[key];
|
||||||
|
}
|
||||||
|
|
||||||
|
return _env as any;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useEnvKeySync = async <T = any>(key: string, init?: () => Promise<T> | null, initKey = 'conifg'): Promise<T> => {
|
||||||
|
const _env = useEnv({}, initKey);
|
||||||
|
if (key && init) {
|
||||||
|
_env[key] = await init();
|
||||||
|
return _env[key];
|
||||||
|
}
|
||||||
|
if (key) {
|
||||||
|
return _env[key];
|
||||||
|
}
|
||||||
|
return _env as any;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const usePageEnv = (init?: () => {}, initKey = 'conifg') => {
|
||||||
|
const { id } = getPathKey();
|
||||||
|
return useEnvKey(id, init, initKey);
|
||||||
|
};
|
||||||
|
|
||||||
|
type GlobalContext = {
|
||||||
|
name?: string;
|
||||||
|
[key: string]: any;
|
||||||
|
};
|
||||||
|
export const useContext = (initContext?: GlobalContext) => {
|
||||||
|
return useEnv(initContext, 'context');
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useContextKey = <T = any>(key: string, init?: () => T): T => {
|
||||||
|
return useEnvKey(key, init, 'context');
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useContextKeySync = async <T = any>(key: string, init?: () => Promise<T>): Promise<T> => {
|
||||||
|
return useEnvKeySync(key, init, 'context');
|
||||||
|
};
|
||||||
|
|
||||||
|
export const usePageContext = (init?: () => {}) => {
|
||||||
|
const { id } = getPathKey();
|
||||||
|
return useContextKey(id, init);
|
||||||
|
};
|
||||||
|
|
||||||
|
type GlobalConfig = {
|
||||||
|
name?: string;
|
||||||
|
[key: string]: any;
|
||||||
|
};
|
||||||
|
export const useConfig = (initConfig?: GlobalConfig) => {
|
||||||
|
return useEnv(initConfig, 'config');
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useConfigKey = <T = any>(key: string, init?: () => T): T => {
|
||||||
|
return useEnvKey(key, init, 'config');
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useConfigKeySync = async <T = any>(key: string, init?: () => Promise<T>): Promise<T> => {
|
||||||
|
return useEnvKeySync(key, init, 'config');
|
||||||
|
};
|
||||||
|
|
||||||
|
export const usePageConfig = (init?: () => {}) => {
|
||||||
|
const { id } = getPathKey();
|
||||||
|
return useConfigKey(id, init);
|
||||||
|
};
|
@ -1,6 +1,5 @@
|
|||||||
export * from './page.ts';
|
export * from './page.ts';
|
||||||
export * from './web-context.ts';
|
export * from './web-env.ts';
|
||||||
export * from './web-config.ts';
|
|
||||||
|
|
||||||
export * from 'nanoid';
|
export * from 'nanoid';
|
||||||
export * from 'path-to-regexp';
|
export * from 'path-to-regexp';
|
||||||
|
@ -10,6 +10,7 @@
|
|||||||
"baseUrl": "./",
|
"baseUrl": "./",
|
||||||
"typeRoots": [
|
"typeRoots": [
|
||||||
"node_modules/@types",
|
"node_modules/@types",
|
||||||
|
"node_modules/@kevisual/types",
|
||||||
],
|
],
|
||||||
"declaration": false,
|
"declaration": false,
|
||||||
"noEmit": true,
|
"noEmit": true,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user