Skip to content

Commit 5767fa8

Browse files
mqhe2007mqhe2007
committed
重构2
1 parent fddce3d commit 5767fa8

11 files changed

+878
-192
lines changed

‎package-lock.json

Lines changed: 788 additions & 133 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
],
2121
"main": "./dist/vue-module-loader.umd.js",
2222
"module": "./dist/vue-module-loader.es.js",
23+
"types": "./dist/src/main.d.ts",
2324
"exports": {
2425
".": {
2526
"import": "./dist/vue-module-loader.es.js",
@@ -34,8 +35,13 @@
3435
"@types/node": "^14.14.31",
3536
"typescript": "^4.1.3",
3637
"vite": "^2.0.1",
38+
"vite-plugin-dts": "^0.5.2",
3739
"vue-router": "^4.0.4",
3840
"vuepress": "^1.8.2",
3941
"vuex": "^4.0.0"
42+
},
43+
"dependencies": {
44+
"@qingjin/jsuper": "^1.2.1",
45+
"vue": "^3.1.3"
4046
}
4147
}

‎src/fire-module.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import ModuleType from "./types/module-type";
1+
import { Context, ModuleOptions } from "./interfaces";
22
import uninstallCache from "./uninstaller";
33

4-
export default async function(moduleData: ModuleType): Promise<void> {
5-
const app = (window as any)[Symbol.for("___VUE_APP___")];
4+
export default async function(moduleData: ModuleOptions): Promise<void> {
5+
const context: Context = window[Symbol.for("___VML_CONTEXT___")];
66
let installReturn;
77
try {
8-
console.log(`[vue-module-loader]: 开始加载模块「${moduleData.name}」……`);
9-
installReturn = await moduleData.install(app);
8+
console.log(`[vue-module-loader]: 开始加载模块「${moduleData.name}」...`);
9+
installReturn = await moduleData.install(context);
1010
if (moduleData.uninstall)
1111
uninstallCache(moduleData.name, moduleData.uninstall);
1212
console.log(`[vue-module-loader]: 模块「${moduleData.name}」加载完成`);

‎src/interfaces.ts

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import { App, CreateAppFunction } from "vue";
2+
export interface Context {
3+
// Vue全局对象
4+
Vue: {
5+
readonly createApp: CreateAppFunction<any>;
6+
readonly [propName: string]: any;
7+
};
8+
// Vue应用实例
9+
app: App;
10+
}
11+
export interface IModuleUninstallerMap {
12+
[propName: string]: (context: Context) => void;
13+
}
14+
export interface ModuleOptions {
15+
name: string;
16+
install: (context: Context) => any;
17+
uninstall: (context: Context) => any;
18+
}

‎src/main.ts

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,21 @@
1-
import { App } from "@vue/runtime-core";
2-
import { version } from "../package.json";
3-
import useModule from "./use-module";
4-
export default function(app: App, vue: any) {
5-
if (!vue?.h) {
6-
(window as any)[Symbol.for("___VML_OK___")] = false;
7-
throw new Error("[vue-module-loader]: 插件配置错误，请传入Vue全局对象");
1+
import { App } from "vue";
2+
import { Context } from "./interfaces";
3+
4+
export default function(app: App, Vue: Context["Vue"]) {
5+
if (!Vue) {
6+
throw new Error(`[vue-module-loader]: use插件时必须传入Vue对象`);
7+
} else {
8+
if (!Vue.version?.startsWith("3")) {
9+
throw new Error(`[vue-module-loader]: 本插件仅适用于vue3`);
10+
} else {
11+
window[Symbol.for("___VML_CONTEXT___")] = {
12+
Vue,
13+
};
14+
if (app) {
15+
window[Symbol.for("___VML_CONTEXT___")]["app"] = app;
16+
}
17+
}
818
}
9-
if (!vue?.version?.startsWith("3")) {
10-
(window as any)[Symbol.for("___VML_OK___")] = false;
11-
throw new Error(`[vue-module-loader]: 当前插件v${version}仅适用于vue3`);
12-
}
13-
(window as any)[Symbol.for("___VUE___")] = vue;
14-
(window as any)[Symbol.for("___VUE_APP___")] = app;
15-
(window as any)[Symbol.for("___VML_OK___")] = true;
1619
}
17-
export { useModule };
20+
export { useModule } from "./use-module";
1821
export { uninstall, clear, listUnistaller } from "./uninstaller";

‎src/types/module-type.ts

Lines changed: 0 additions & 7 deletions
This file was deleted.

‎src/types/module-uninstaller-map-type.ts

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎src/uninstaller.ts

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,26 @@
22
* 模块卸载器
33
* 当模块安装时会缓存卸载程序。
44
*/
5-
import { App } from "@vue/runtime-core";
6-
import IModuleUninstallerMap from "./types/module-uninstaller-map-type";
5+
6+
import { Context, IModuleUninstallerMap } from "./interfaces";
77

88
const moduleUninstallerMap: IModuleUninstallerMap = {};
99

10-
export default function(moduleName: string, uninstaller: (app: App) => void) {
10+
export default function(
11+
moduleName: string,
12+
uninstaller: (context: Context) => any
13+
) {
1114
moduleUninstallerMap[moduleName] = uninstaller;
1215
}
1316
export function listUnistaller() {
1417
return moduleUninstallerMap;
1518
}
1619
export async function uninstall(moduleName: string) {
17-
const app = (window as any)[Symbol.for("___VUE_APP___")];
20+
const app = (window as any)[Symbol.for("__GLOBAL_VUE_APP__")];
1821
moduleUninstallerMap[moduleName](app);
1922
}
2023
export async function clear() {
21-
const app = (window as any)[Symbol.for("___VUE_APP___")];
24+
const app = (window as any)[Symbol.for("__GLOBAL_VUE_APP__")];
2225
for (let moduleName in moduleUninstallerMap) {
2326
moduleUninstallerMap[moduleName](app);
2427
}

‎src/use-module.ts

Lines changed: 30 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,40 @@
11
import fireModule from "./fire-module";
2-
import ModuleType from "./types/module-type";
3-
async function useModule(moduleData: ModuleType): Promise<void>;
4-
async function useModule(moduleData: string): Promise<void>;
5-
async function useModule(moduleData: any): Promise<void> {
6-
if (!(window as any)[Symbol.for("___VML_OK___")])
7-
throw new Error(
8-
"[vue-module-loader]: 使用useModule方法出错。插件未安装或安装失败，请检查。"
9-
);
10-
if (typeof moduleData == "object") {
2+
import { Context, ModuleOptions } from "./interfaces";
3+
/**
4+
* 使用模块
5+
* @param moduleData 模块数据，可以是模块定义对象或者是模块资源url.
6+
* @param Vue 全局Vue对象，可以是模块定义对象或者是模块资源url.
7+
*/
8+
async function useModule(
9+
moduleData: ModuleOptions,
10+
Vue?: Context["Vue"]
11+
): Promise<void>;
12+
async function useModule(
13+
moduleData: string,
14+
Vue?: Context["Vue"]
15+
): Promise<void>;
16+
async function useModule(moduleData: any, Vue?: Context["Vue"]): Promise<void> {
17+
if (!window[Symbol.for("___VML_CONTEXT___")]) {
18+
if (!Vue) {
19+
throw new Error(
20+
"[vue-module-loader]: 未use插件时使用useModule方法请在第二个参数传入Vue全局对象"
21+
);
22+
} else {
23+
window[Symbol.for("___VML_CONTEXT___")] = { Vue };
24+
}
25+
}
26+
if (typeof moduleData === "object") {
1127
return await fireModule(moduleData);
12-
} else if (typeof moduleData == "string") {
13-
const Vue = (window as any)[Symbol.for("___VUE___")];
28+
} else if (typeof moduleData === "string") {
1429
const res = await fetch(moduleData);
1530
const moduleString = await res.text();
1631
const moduleCode = moduleString.replace("var", "return");
1732
const moduleStringFun = Function(`return function(vue){${moduleCode}}`)();
18-
const moduleDataFromUrl = moduleStringFun(Vue);
33+
const moduleDataFromUrl = moduleStringFun(
34+
window[Symbol.for("___VML_CONTEXT___")].Vue
35+
);
1936
return await fireModule(moduleDataFromUrl);
2037
}
2138
}
2239

23-
export default useModule;
40+
export { useModule };

‎tsconfig.json

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,6 @@
11
{
22
"compilerOptions": {
3-
"declaration": true,
4-
"declarationDir": "types",
5-
"target": "esnext",
6-
"module": "esnext",
7-
"moduleResolution": "node",
8-
"strict": true,
9-
"jsx": "preserve",
10-
"sourceMap": true,
113
"resolveJsonModule": true,
12-
"esModuleInterop": true,
134
"lib": ["esnext", "dom"],
145
"types": ["vite/client"]
156
},

‎vite.config.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,21 @@
11
import { resolve } from "path";
22
import { defineConfig } from "vite";
3+
import dts from "vite-plugin-dts";
34

45
export default defineConfig({
56
build: {
67
lib: {
78
entry: resolve(__dirname, "src/main.ts"),
89
name: "vueModuleLoader",
910
},
11+
target: "es2015",
12+
sourcemap: true,
13+
minify: false,
1014
terserOptions: {
1115
format: {
1216
comments: "all",
1317
},
1418
},
1519
},
20+
plugins: [dts()],
1621
});

0 commit comments

Comments
 (0)