vite-add-cdn-script 0.0.1 → 0.0.2
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +17 -27
- package/dist/index.js +22 -26
- package/dist/index.umd.cjs +6 -6
- package/package.json +1 -1
package/README.md
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
# vite-add-cdn-script
|
2
2
|
|
3
|
-
这是一个在vite.js中使用公共cdn的库,包括了
|
3
|
+
这是一个在 vite.js 中使用公共 cdn 的库,包括了 unpkg, cdnjs, jsdelivr, staticfile 等多个 cdn 资源,如加载失败会自动切换下一个 cdn 进行加载。
|
4
4
|
|
5
5
|
## 开始
|
6
6
|
|
@@ -27,10 +27,7 @@ const externals = {
|
|
27
27
|
};
|
28
28
|
|
29
29
|
export default defineConfig({
|
30
|
-
plugins: [
|
31
|
-
react(),
|
32
|
-
viteAddCdnScript({}),
|
33
|
-
],
|
30
|
+
plugins: [react(), viteAddCdnScript({})],
|
34
31
|
build: {
|
35
32
|
rollupOptions: {
|
36
33
|
external: [...Object.keys(externals)],
|
@@ -40,9 +37,7 @@ export default defineConfig({
|
|
40
37
|
});
|
41
38
|
```
|
42
39
|
|
43
|
-
|
44
|
-
|
45
|
-
使用自定义的cdn
|
40
|
+
使用自定义的 cdn
|
46
41
|
|
47
42
|
```typescript
|
48
43
|
import { defineConfig } from "vite";
|
@@ -61,7 +56,8 @@ export default defineConfig({
|
|
61
56
|
viteAddCdnScript({
|
62
57
|
customScript: {
|
63
58
|
react: "<script src='https://cdn.jsdelivr.net/npm/react@17.0.2/umd/react.production.min.js'></script>",
|
64
|
-
"react-dom":
|
59
|
+
"react-dom":
|
60
|
+
"<script src='https://cdn.jsdelivr.net/npm/react-dom@17.0.2/umd/react-dom.production.min.js'></script>",
|
65
61
|
},
|
66
62
|
}),
|
67
63
|
],
|
@@ -73,37 +69,31 @@ export default defineConfig({
|
|
73
69
|
},
|
74
70
|
},
|
75
71
|
});
|
76
|
-
|
77
72
|
```
|
78
73
|
|
79
|
-
|
80
|
-
|
81
74
|
options
|
82
75
|
|
83
|
-
| 参数 | 解析
|
84
|
-
| ------------ |
|
85
|
-
| protocol | 协议
|
86
|
-
| customScript | 自定义cdn脚本 | { [*key*: string]: string } | 无
|
87
|
-
| retryTimes | 重试次数
|
88
|
-
| defaultCdns | 默认使用cdn的顺序 | string[] | ["bootcdn", "bytedance", "unpkg", "cdnjs", "jsdelivr", "staticfile"] |
|
89
|
-
|
90
|
-
|
76
|
+
| 参数 | 解析 | 类型 | 默认值 |
|
77
|
+
| ------------ | ------------------- | --------------------------- | -------------------------------------------------------------------- |
|
78
|
+
| protocol | 协议 | “http”\|“https” | https |
|
79
|
+
| customScript | 自定义 cdn 脚本 | { [*key*: string]: string } | 无 |
|
80
|
+
| retryTimes | 重试次数 | number | 3 |
|
81
|
+
| defaultCdns | 默认使用 cdn 的顺序 | string[] | ["bootcdn", "bytedance", "unpkg", "cdnjs", "jsdelivr", "staticfile"] |
|
91
82
|
|
92
83
|
## 注意事项
|
93
84
|
|
94
|
-
因为cdn对包管理的命名有很大的不同,默认是使用了xxx.min.js的文件,如果您使用的库的cdn文件不是这个的话,则需要配置为自定义的cdn。
|
85
|
+
因为 cdn 对包管理的命名有很大的不同,默认是使用了 dist/xxx.min.js 的文件,如果您使用的库的 cdn 文件不是这个的话,则需要配置为自定义的 cdn。
|
95
86
|
|
96
|
-
目前做了适配的非xxx.min.js适配的库如下,如果你有合适的cdn源或者,需要适配的库,欢迎提交issue或者pr!!!
|
87
|
+
目前做了适配的非 xxx.min.js 适配的库如下,如果你有合适的 cdn 源或者,需要适配的库,欢迎提交 issue 或者 pr!!!
|
97
88
|
|
98
89
|
```
|
99
90
|
{
|
100
91
|
react: "umd/react.production.min.js",
|
101
92
|
"react-dom": "umd/react-dom.production.min.js",
|
102
93
|
"react-router-dom": "react-router-dom.production.min.js",
|
103
|
-
mobx: "mobx.umd.production.min.js",
|
104
|
-
"mobx-react": "mobxreact.umd.production.min.js",
|
105
|
-
vue: "vue.global.
|
106
|
-
"vue-router": "vue-router.global.prod.
|
94
|
+
mobx: "dist/mobx.umd.production.min.js",
|
95
|
+
"mobx-react": "/dist/mobxreact.umd.production.min.js",
|
96
|
+
vue: "/dist/vue.global.prod.js",
|
97
|
+
"vue-router": "/dist/vue-router.global.prod.js",
|
107
98
|
}
|
108
99
|
```
|
109
|
-
|
package/dist/index.js
CHANGED
@@ -2,34 +2,30 @@ import N from "node:path";
|
|
2
2
|
import v from "node:fs";
|
3
3
|
const d = {
|
4
4
|
unpkg: "unpkg.com",
|
5
|
-
bytedance: "lf26-cdn-tos.bytecdntp.com/cdn",
|
6
5
|
staticfile: "cdn.staticfile.net",
|
7
6
|
cdnjs: "cdnjs.cloudflare.com/ajax/libs",
|
8
|
-
jsdelivr: "cdn.jsdelivr.net/npm"
|
9
|
-
|
10
|
-
}, i = {
|
7
|
+
jsdelivr: "cdn.jsdelivr.net/npm"
|
8
|
+
}, u = {
|
11
9
|
unpkg: "@",
|
12
|
-
bytedance: "/",
|
13
10
|
staticfile: "/",
|
14
11
|
cdnjs: "/",
|
15
|
-
jsdelivr: "@"
|
16
|
-
|
17
|
-
}, u = {
|
12
|
+
jsdelivr: "@"
|
13
|
+
}, p = {
|
18
14
|
react: "umd/react.production.min.js",
|
19
15
|
"react-dom": "umd/react-dom.production.min.js",
|
20
16
|
"react-router-dom": "react-router-dom.production.min.js",
|
21
|
-
mobx: "mobx.umd.production.min.js",
|
22
|
-
"mobx-react": "mobxreact.umd.production.min.js",
|
23
|
-
vue: "vue.global.
|
24
|
-
"vue-router": "vue-router.global.prod.
|
17
|
+
mobx: "dist/mobx.umd.production.min.js",
|
18
|
+
"mobx-react": "/dist/mobxreact.umd.production.min.js",
|
19
|
+
vue: "/dist/vue.global.prod.js",
|
20
|
+
"vue-router": "/dist/vue-router.global.prod.js"
|
25
21
|
};
|
26
|
-
function
|
22
|
+
function h(l) {
|
27
23
|
const {
|
28
|
-
protocol:
|
24
|
+
protocol: m = "https",
|
29
25
|
customScript: c = {},
|
30
|
-
retryTimes:
|
31
|
-
defaultCdns:
|
32
|
-
} =
|
26
|
+
retryTimes: f = 3,
|
27
|
+
defaultCdns: s = ["unpkg", "cdnjs", "jsdelivr", "staticfile"]
|
28
|
+
} = l;
|
33
29
|
let o;
|
34
30
|
return {
|
35
31
|
name: "vite-add-cdn-script",
|
@@ -39,16 +35,16 @@ function C(p) {
|
|
39
35
|
o = e;
|
40
36
|
},
|
41
37
|
transformIndexHtml(e) {
|
42
|
-
const
|
38
|
+
const j = N.resolve(process.cwd(), "package.json");
|
43
39
|
try {
|
44
|
-
const r =
|
40
|
+
const r = s[0], g = v.readFileSync(j, "utf-8"), a = JSON.parse(g), b = o.build.rollupOptions.external;
|
45
41
|
let n = "" + `<script>
|
46
|
-
const separators = JSON.parse('${JSON.stringify(
|
42
|
+
const separators = JSON.parse('${JSON.stringify(u)}');
|
47
43
|
const cdnUrlObj = JSON.parse('${JSON.stringify(d)}');
|
48
|
-
const defaultCdns = JSON.parse('${JSON.stringify(
|
44
|
+
const defaultCdns = JSON.parse('${JSON.stringify(s)}');
|
49
45
|
function errorCDN(e) {
|
50
46
|
const nextCur = parseInt(e.getAttribute("data-cur")) + 1;
|
51
|
-
if(nextCur>=${
|
47
|
+
if(nextCur>=${f}){return;}
|
52
48
|
const filename = e.getAttribute("data-filename");
|
53
49
|
const key = e.getAttribute("data-key");
|
54
50
|
const urlName = defaultCdns[nextCur]
|
@@ -68,12 +64,12 @@ function C(p) {
|
|
68
64
|
}
|
69
65
|
<\/script>`;
|
70
66
|
return Object.keys(a.dependencies).forEach((t) => {
|
71
|
-
if (
|
67
|
+
if (b.includes(t))
|
72
68
|
if (c[t])
|
73
69
|
n += c[t];
|
74
70
|
else {
|
75
|
-
const
|
76
|
-
n += `<script src="${O}" type="text/javascript" onerror="errorCDN(this)" data-cur="0" data-key="${t}" data-filename="${
|
71
|
+
const i = a.dependencies[t].replace("^", "") + "/" + (p[t] ? p[t] : `dist/${t}.min.js`), O = `${m}://${d[r]}/${t}${u[r]}${i}`;
|
72
|
+
n += `<script src="${O}" type="text/javascript" onerror="errorCDN(this)" data-cur="0" data-key="${t}" data-filename="${i}"><\/script>
|
77
73
|
`;
|
78
74
|
}
|
79
75
|
}), e = e.replace("</head>", `${n}</head>`), e;
|
@@ -84,5 +80,5 @@ function C(p) {
|
|
84
80
|
};
|
85
81
|
}
|
86
82
|
export {
|
87
|
-
|
83
|
+
h as default
|
88
84
|
};
|
package/dist/index.umd.cjs
CHANGED
@@ -1,10 +1,10 @@
|
|
1
|
-
(function(t,
|
1
|
+
(function(t,r){typeof exports=="object"&&typeof module<"u"?module.exports=r(require("node:path"),require("node:fs")):typeof define=="function"&&define.amd?define(["node:path","node:fs"],r):(t=typeof globalThis<"u"?globalThis:t||self,t.index=r(t.path,t.fs))})(this,function(t,r){"use strict";const o={unpkg:"unpkg.com",staticfile:"cdn.staticfile.net",cdnjs:"cdnjs.cloudflare.com/ajax/libs",jsdelivr:"cdn.jsdelivr.net/npm"},a={unpkg:"@",staticfile:"/",cdnjs:"/",jsdelivr:"@"},i={react:"umd/react.production.min.js","react-dom":"umd/react-dom.production.min.js","react-router-dom":"react-router-dom.production.min.js",mobx:"dist/mobx.umd.production.min.js","mobx-react":"/dist/mobxreact.umd.production.min.js",vue:"/dist/vue.global.prod.js","vue-router":"/dist/vue-router.global.prod.js"};function f(j){const{protocol:b="https",customScript:d={},retryTimes:g=3,defaultCdns:u=["unpkg","cdnjs","jsdelivr","staticfile"]}=j;let p;return{name:"vite-add-cdn-script",enforce:"pre",apply:"build",config(n){p=n},transformIndexHtml(n){const O=t.resolve(process.cwd(),"package.json");try{const s=u[0],N=r.readFileSync(O,"utf-8"),l=JSON.parse(N),h=p.build.rollupOptions.external;let c=""+`<script>
|
2
2
|
const separators = JSON.parse('${JSON.stringify(a)}');
|
3
|
-
const cdnUrlObj = JSON.parse('${JSON.stringify(
|
4
|
-
const defaultCdns = JSON.parse('${JSON.stringify(
|
3
|
+
const cdnUrlObj = JSON.parse('${JSON.stringify(o)}');
|
4
|
+
const defaultCdns = JSON.parse('${JSON.stringify(u)}');
|
5
5
|
function errorCDN(e) {
|
6
6
|
const nextCur = parseInt(e.getAttribute("data-cur")) + 1;
|
7
|
-
if(nextCur>=${
|
7
|
+
if(nextCur>=${g}){return;}
|
8
8
|
const filename = e.getAttribute("data-filename");
|
9
9
|
const key = e.getAttribute("data-key");
|
10
10
|
const urlName = defaultCdns[nextCur]
|
@@ -22,5 +22,5 @@
|
|
22
22
|
document.head.appendChild(cdnDOM);
|
23
23
|
e.remove();
|
24
24
|
}
|
25
|
-
<\/script>`;return Object.keys(
|
26
|
-
`}}),
|
25
|
+
<\/script>`;return Object.keys(l.dependencies).forEach(e=>{if(h.includes(e))if(d[e])c+=d[e];else{const m=l.dependencies[e].replace("^","")+"/"+(i[e]?i[e]:`dist/${e}.min.js`),x=`${b}://${o[s]}/${e}${a[s]}${m}`;c+=`<script src="${x}" type="text/javascript" onerror="errorCDN(this)" data-cur="0" data-key="${e}" data-filename="${m}"><\/script>
|
26
|
+
`}}),n=n.replace("</head>",`${c}</head>`),n}catch(s){console.error("获取dependencies出错:",s)}}}}return f});
|