@vearvip/vite-plugin-cdn-import 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,155 @@
1
+ import { HtmlTagDescriptor, Plugin } from 'vite';
2
+
3
+ /**
4
+ * module 配置自动完成
5
+ */
6
+ declare const modulesConfig: {
7
+ react: {
8
+ var: string;
9
+ jsdeliver: {
10
+ path: string;
11
+ };
12
+ bootCdn: {
13
+ path: string;
14
+ };
15
+ };
16
+ 'react-dom': {
17
+ var: string;
18
+ alias: string[];
19
+ jsdeliver: {
20
+ path: string;
21
+ };
22
+ bootCdn: {
23
+ path: string;
24
+ };
25
+ };
26
+ 'react-router-dom': {
27
+ var: string;
28
+ jsdeliver: {
29
+ path: string;
30
+ };
31
+ bootCdn: {
32
+ path: string;
33
+ };
34
+ };
35
+ antd: {
36
+ var: string;
37
+ jsdeliver: {
38
+ path: string;
39
+ css: string;
40
+ };
41
+ bootCdn: {
42
+ path: string;
43
+ css: string;
44
+ };
45
+ };
46
+ vue: {
47
+ var: string;
48
+ jsdeliver: {
49
+ path: string;
50
+ };
51
+ bootCdn: {
52
+ path: string;
53
+ };
54
+ };
55
+ 'vue-router': {
56
+ var: string;
57
+ jsdeliver: {
58
+ path: string;
59
+ };
60
+ bootCdn: {
61
+ path: string;
62
+ };
63
+ };
64
+ 'vue-router@3': {
65
+ var: string;
66
+ jsdeliver: {
67
+ name: string;
68
+ path: string;
69
+ };
70
+ bootCdn: {
71
+ name: string;
72
+ path: string;
73
+ };
74
+ };
75
+ vue2: {
76
+ var: string;
77
+ jsdeliver: {
78
+ name: string;
79
+ path: string;
80
+ };
81
+ bootCdn: {
82
+ name: string;
83
+ path: string;
84
+ };
85
+ };
86
+ moment: {
87
+ var: string;
88
+ jsdeliver: {
89
+ path: string;
90
+ };
91
+ bootCdn: {
92
+ path: string;
93
+ };
94
+ };
95
+ dayjs: {
96
+ var: string;
97
+ jsdeliver: {
98
+ path: string;
99
+ };
100
+ bootCdn: {
101
+ path: string;
102
+ };
103
+ };
104
+ axios: {
105
+ var: string;
106
+ jsdeliver: {
107
+ path: string;
108
+ };
109
+ bootCdn: {
110
+ path: string;
111
+ };
112
+ };
113
+ lodash: {
114
+ var: string;
115
+ jsdeliver: {
116
+ path: string;
117
+ };
118
+ bootCdn: {
119
+ path: string;
120
+ };
121
+ };
122
+ };
123
+ type ModuleName = keyof typeof modulesConfig;
124
+ type GetModuleFunc$1 = (prodUrl: string) => Module;
125
+ declare function autoComplete$1(name: ModuleName): GetModuleFunc$1;
126
+ declare function autoComplete$1(name: ModuleName[]): GetModuleFunc$1[];
127
+
128
+ type GetModuleFunc = (prodUrl: string) => Module;
129
+ interface Module {
130
+ name: string;
131
+ var: string;
132
+ path: string | string[];
133
+ /** Alias ​​of name, for example "react-dom/client" is an alias of "react-dom" */
134
+ alias?: string[];
135
+ css?: string | string[];
136
+ prodUrl?: string;
137
+ }
138
+ interface Options {
139
+ prodUrl?: string;
140
+ modules: (ModuleName | Module | Module[] | GetModuleFunc | GetModuleFunc[])[];
141
+ /** Enabled in dev mode, default is false */
142
+ enableInDevMode?: boolean;
143
+ /** Generate the external script tag */
144
+ generateScriptTag?: (name: string, scriptUrl: string) => Omit<HtmlTagDescriptor, 'tag' | 'children'>;
145
+ /** Generate the external css link tag */
146
+ generateCssLinkTag?: (name: string, cssUrl: string) => Omit<HtmlTagDescriptor, 'tag' | 'children'>;
147
+ }
148
+
149
+ declare function PluginImportToCDN(options: Options): Plugin[];
150
+ /**
151
+ * @deprecated Pass the package name directly in options.modules instead.
152
+ */
153
+ declare const autoComplete: typeof autoComplete$1;
154
+
155
+ export { type Options, PluginImportToCDN as Plugin, autoComplete, PluginImportToCDN as default };
@@ -0,0 +1,155 @@
1
+ import { HtmlTagDescriptor, Plugin } from 'vite';
2
+
3
+ /**
4
+ * module 配置自动完成
5
+ */
6
+ declare const modulesConfig: {
7
+ react: {
8
+ var: string;
9
+ jsdeliver: {
10
+ path: string;
11
+ };
12
+ bootCdn: {
13
+ path: string;
14
+ };
15
+ };
16
+ 'react-dom': {
17
+ var: string;
18
+ alias: string[];
19
+ jsdeliver: {
20
+ path: string;
21
+ };
22
+ bootCdn: {
23
+ path: string;
24
+ };
25
+ };
26
+ 'react-router-dom': {
27
+ var: string;
28
+ jsdeliver: {
29
+ path: string;
30
+ };
31
+ bootCdn: {
32
+ path: string;
33
+ };
34
+ };
35
+ antd: {
36
+ var: string;
37
+ jsdeliver: {
38
+ path: string;
39
+ css: string;
40
+ };
41
+ bootCdn: {
42
+ path: string;
43
+ css: string;
44
+ };
45
+ };
46
+ vue: {
47
+ var: string;
48
+ jsdeliver: {
49
+ path: string;
50
+ };
51
+ bootCdn: {
52
+ path: string;
53
+ };
54
+ };
55
+ 'vue-router': {
56
+ var: string;
57
+ jsdeliver: {
58
+ path: string;
59
+ };
60
+ bootCdn: {
61
+ path: string;
62
+ };
63
+ };
64
+ 'vue-router@3': {
65
+ var: string;
66
+ jsdeliver: {
67
+ name: string;
68
+ path: string;
69
+ };
70
+ bootCdn: {
71
+ name: string;
72
+ path: string;
73
+ };
74
+ };
75
+ vue2: {
76
+ var: string;
77
+ jsdeliver: {
78
+ name: string;
79
+ path: string;
80
+ };
81
+ bootCdn: {
82
+ name: string;
83
+ path: string;
84
+ };
85
+ };
86
+ moment: {
87
+ var: string;
88
+ jsdeliver: {
89
+ path: string;
90
+ };
91
+ bootCdn: {
92
+ path: string;
93
+ };
94
+ };
95
+ dayjs: {
96
+ var: string;
97
+ jsdeliver: {
98
+ path: string;
99
+ };
100
+ bootCdn: {
101
+ path: string;
102
+ };
103
+ };
104
+ axios: {
105
+ var: string;
106
+ jsdeliver: {
107
+ path: string;
108
+ };
109
+ bootCdn: {
110
+ path: string;
111
+ };
112
+ };
113
+ lodash: {
114
+ var: string;
115
+ jsdeliver: {
116
+ path: string;
117
+ };
118
+ bootCdn: {
119
+ path: string;
120
+ };
121
+ };
122
+ };
123
+ type ModuleName = keyof typeof modulesConfig;
124
+ type GetModuleFunc$1 = (prodUrl: string) => Module;
125
+ declare function autoComplete$1(name: ModuleName): GetModuleFunc$1;
126
+ declare function autoComplete$1(name: ModuleName[]): GetModuleFunc$1[];
127
+
128
+ type GetModuleFunc = (prodUrl: string) => Module;
129
+ interface Module {
130
+ name: string;
131
+ var: string;
132
+ path: string | string[];
133
+ /** Alias ​​of name, for example "react-dom/client" is an alias of "react-dom" */
134
+ alias?: string[];
135
+ css?: string | string[];
136
+ prodUrl?: string;
137
+ }
138
+ interface Options {
139
+ prodUrl?: string;
140
+ modules: (ModuleName | Module | Module[] | GetModuleFunc | GetModuleFunc[])[];
141
+ /** Enabled in dev mode, default is false */
142
+ enableInDevMode?: boolean;
143
+ /** Generate the external script tag */
144
+ generateScriptTag?: (name: string, scriptUrl: string) => Omit<HtmlTagDescriptor, 'tag' | 'children'>;
145
+ /** Generate the external css link tag */
146
+ generateCssLinkTag?: (name: string, cssUrl: string) => Omit<HtmlTagDescriptor, 'tag' | 'children'>;
147
+ }
148
+
149
+ declare function PluginImportToCDN(options: Options): Plugin[];
150
+ /**
151
+ * @deprecated Pass the package name directly in options.modules instead.
152
+ */
153
+ declare const autoComplete: typeof autoComplete$1;
154
+
155
+ export { type Options, PluginImportToCDN as Plugin, autoComplete, PluginImportToCDN as default };
package/dist/index.js ADDED
@@ -0,0 +1,346 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
+ var __spreadValues = (a, b) => {
9
+ for (var prop in b || (b = {}))
10
+ if (__hasOwnProp.call(b, prop))
11
+ __defNormalProp(a, prop, b[prop]);
12
+ if (__getOwnPropSymbols)
13
+ for (var prop of __getOwnPropSymbols(b)) {
14
+ if (__propIsEnum.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ }
17
+ return a;
18
+ };
19
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
+
21
+ // src/index.ts
22
+ import externalGlobals from "rollup-plugin-external-globals";
23
+ import { viteExternalsPlugin } from "vite-plugin-externals";
24
+ import fs from "fs";
25
+ import path from "path";
26
+
27
+ // src/autoComplete.ts
28
+ var isDev = process.env.NODE_ENV === "development";
29
+ var modulesConfig = {
30
+ react: {
31
+ var: "React",
32
+ jsdeliver: {
33
+ path: isDev ? "umd/react.development.js" : "umd/react.production.min.js"
34
+ },
35
+ bootCdn: {
36
+ path: isDev ? "umd/react.development.js" : "umd/react.production.min.js"
37
+ }
38
+ },
39
+ "react-dom": {
40
+ var: "ReactDOM",
41
+ alias: ["react-dom/client"],
42
+ jsdeliver: {
43
+ path: isDev ? "umd/react-dom.development.js" : "umd/react-dom.production.min.js"
44
+ },
45
+ bootCdn: {
46
+ path: isDev ? "umd/react-dom.development.js" : "umd/react-dom.production.min.js"
47
+ }
48
+ },
49
+ "react-router-dom": {
50
+ var: "ReactRouterDOM",
51
+ jsdeliver: {
52
+ path: "dist/umd/react-router-dom.production.min.js"
53
+ },
54
+ bootCdn: {
55
+ path: "umd/react-router-dom.production.min.js"
56
+ }
57
+ },
58
+ antd: {
59
+ var: "antd",
60
+ jsdeliver: {
61
+ path: "dist/antd.min.js",
62
+ css: "dist/reset.min.css"
63
+ },
64
+ bootCdn: {
65
+ path: "antd.min.js",
66
+ css: "reset.min.css"
67
+ }
68
+ },
69
+ vue: {
70
+ var: "Vue",
71
+ jsdeliver: {
72
+ path: isDev ? "dist/vue.runtime.global.js" : "dist/vue.runtime.global.prod.js"
73
+ },
74
+ bootCdn: {
75
+ path: isDev ? "vue.runtime.global.js" : "vue.runtime.global.prod.js"
76
+ }
77
+ },
78
+ "vue-router": {
79
+ var: "VueRouter",
80
+ jsdeliver: {
81
+ path: "dist/vue-router.global.min.js"
82
+ },
83
+ bootCdn: {
84
+ path: "vue-router.global.min.js"
85
+ }
86
+ },
87
+ "vue-router@3": {
88
+ var: "VueRouter",
89
+ jsdeliver: {
90
+ name: "vue-router",
91
+ path: "dist/vue-router.min.js"
92
+ },
93
+ bootCdn: {
94
+ name: "vue-router",
95
+ path: "vue-router.min.js"
96
+ }
97
+ },
98
+ vue2: {
99
+ var: "Vue",
100
+ jsdeliver: {
101
+ name: "vue",
102
+ path: isDev ? "dist/vue.runtime.js" : "dist/vue.runtime.min.js"
103
+ },
104
+ bootCdn: {
105
+ name: "vue",
106
+ path: isDev ? "vue.runtime.js" : "vue.runtime.min.js"
107
+ }
108
+ },
109
+ moment: {
110
+ var: "moment",
111
+ jsdeliver: {
112
+ path: "moment.min.js"
113
+ },
114
+ bootCdn: {
115
+ path: "moment.min.js"
116
+ }
117
+ },
118
+ dayjs: {
119
+ var: "dayjs",
120
+ jsdeliver: {
121
+ path: "dayjs.min.js"
122
+ },
123
+ bootCdn: {
124
+ path: "dayjs.min.js"
125
+ }
126
+ },
127
+ axios: {
128
+ var: "axios",
129
+ jsdeliver: {
130
+ path: "dist/axios.min.js"
131
+ },
132
+ bootCdn: {
133
+ path: "axios.min.js"
134
+ }
135
+ },
136
+ lodash: {
137
+ var: "_",
138
+ jsdeliver: {
139
+ path: "lodash.min.js"
140
+ },
141
+ bootCdn: {
142
+ path: "lodash.min.js"
143
+ }
144
+ }
145
+ };
146
+ function isJsdeliver(prodUrl) {
147
+ return prodUrl.includes("//cdn.jsdelivr.net");
148
+ }
149
+ function isUnpkg(prodUrl) {
150
+ return prodUrl.includes("//unpkg.com");
151
+ }
152
+ function isCdnjs(prodUrl) {
153
+ return prodUrl.includes("//cdnjs.cloudflare.com");
154
+ }
155
+ function isBootCdn(prodUrl) {
156
+ return prodUrl.includes("//cdn.bootcdn.net");
157
+ }
158
+ function genModuleByName(name) {
159
+ const config = modulesConfig[name];
160
+ if (!config) {
161
+ throw new Error(`The configuration of module ${name} does not exist `);
162
+ }
163
+ return (prodUrl) => {
164
+ if (isCdnjs(prodUrl)) {
165
+ throw new Error(
166
+ `The configuration of module ${name} in ${prodUrl} does not exist `
167
+ );
168
+ } else {
169
+ if (!(isJsdeliver(prodUrl) || isUnpkg(prodUrl)) || isBootCdn(prodUrl)) {
170
+ console.warn(
171
+ "Unknown CDN, please ensure that this CDN supports jsdelivr rules"
172
+ );
173
+ }
174
+ return __spreadValues({
175
+ name,
176
+ var: config.var,
177
+ alias: config.alias
178
+ }, isBootCdn(prodUrl) ? config.bootCdn : config.jsdeliver);
179
+ }
180
+ };
181
+ }
182
+ function autoComplete(name) {
183
+ if (Array.isArray(name)) {
184
+ return name.map(genModuleByName);
185
+ } else {
186
+ return genModuleByName(name);
187
+ }
188
+ }
189
+ var autoComplete_default = autoComplete;
190
+
191
+ // src/index.ts
192
+ var isDev2 = process.env.NODE_ENV === "development";
193
+ function getModuleVersion(name) {
194
+ const pwd = process.cwd();
195
+ const pkgFile = path.join(pwd, "node_modules", name, "package.json");
196
+ if (fs.existsSync(pkgFile)) {
197
+ const pkgJson = JSON.parse(fs.readFileSync(pkgFile, "utf8"));
198
+ return pkgJson.version;
199
+ }
200
+ return "";
201
+ }
202
+ function isFullPath(path2) {
203
+ return path2.startsWith("http:") || path2.startsWith("https:") || path2.startsWith("//") ? true : false;
204
+ }
205
+ function renderUrl(url, data) {
206
+ const { path: path2 } = data;
207
+ if (isFullPath(path2)) {
208
+ url = path2;
209
+ }
210
+ return url.replace(/\{name\}/g, data.name).replace(/\{version\}/g, data.version).replace(/\{path\}/g, path2);
211
+ }
212
+ function getModuleInfo(module, prodUrl) {
213
+ prodUrl = module.prodUrl || prodUrl;
214
+ let v = module;
215
+ const version = getModuleVersion(v.name);
216
+ let pathList = [];
217
+ if (!Array.isArray(v.path)) {
218
+ pathList.push(v.path);
219
+ } else {
220
+ pathList = v.path;
221
+ }
222
+ const data = __spreadProps(__spreadValues({}, v), {
223
+ version
224
+ });
225
+ pathList = pathList.map((p) => {
226
+ if (!version && !isFullPath(p)) {
227
+ throw new Error(
228
+ `modules: ${data.name} package.json file does not exist`
229
+ );
230
+ }
231
+ return renderUrl(prodUrl, __spreadProps(__spreadValues({}, data), {
232
+ path: p
233
+ }));
234
+ });
235
+ let css = v.css || [];
236
+ if (!Array.isArray(css) && css) {
237
+ css = [css];
238
+ }
239
+ const cssList = !Array.isArray(css) ? [] : css.map(
240
+ (c) => renderUrl(prodUrl, __spreadProps(__spreadValues({}, data), {
241
+ path: c
242
+ }))
243
+ );
244
+ return __spreadProps(__spreadValues({}, v), {
245
+ version,
246
+ pathList,
247
+ cssList
248
+ });
249
+ }
250
+ function PluginImportToCDN(options) {
251
+ const {
252
+ modules = [],
253
+ prodUrl = "https://cdn.jsdelivr.net/npm/{name}@{version}/{path}",
254
+ enableInDevMode = false,
255
+ generateCssLinkTag,
256
+ generateScriptTag
257
+ } = options;
258
+ let isBuild = false;
259
+ const data = modules.map((_m) => {
260
+ const m = typeof _m === "string" ? autoComplete_default(_m) : _m;
261
+ const list = (Array.isArray(m) ? m : [m]).map(
262
+ (v) => typeof v === "function" ? v(prodUrl) : v
263
+ );
264
+ return list.map((v) => getModuleInfo(v, prodUrl));
265
+ }).flat();
266
+ const externalMap = {};
267
+ data.forEach((v) => {
268
+ externalMap[v.name] = v.var;
269
+ if (Array.isArray(v.alias)) {
270
+ v.alias.forEach((alias) => {
271
+ externalMap[alias] = v.var;
272
+ });
273
+ }
274
+ });
275
+ const plugins = [
276
+ {
277
+ name: "vite-plugin-cdn-import",
278
+ enforce: "pre",
279
+ config(_, { command }) {
280
+ isBuild = command === "build";
281
+ let userConfig = {
282
+ build: {
283
+ rollupOptions: {
284
+ plugins: []
285
+ }
286
+ }
287
+ };
288
+ if (isBuild) {
289
+ userConfig.build.rollupOptions.plugins = [
290
+ externalGlobals(externalMap)
291
+ ];
292
+ }
293
+ return userConfig;
294
+ },
295
+ transformIndexHtml(html) {
296
+ if (!isBuild && !enableInDevMode) {
297
+ return html;
298
+ }
299
+ const descriptors = [];
300
+ data.forEach((v) => {
301
+ v.pathList.forEach((url) => {
302
+ const cusomize = (generateScriptTag == null ? void 0 : generateScriptTag(v.name, url)) || {};
303
+ const attrs = __spreadValues({
304
+ src: url,
305
+ crossorigin: "anonymous"
306
+ }, cusomize.attrs);
307
+ descriptors.push(__spreadProps(__spreadValues({
308
+ tag: "script"
309
+ }, cusomize), {
310
+ attrs
311
+ }));
312
+ });
313
+ v.cssList.forEach((url) => {
314
+ const cusomize = (generateCssLinkTag == null ? void 0 : generateCssLinkTag(v.name, url)) || {};
315
+ const attrs = __spreadValues({
316
+ href: url,
317
+ rel: "stylesheet",
318
+ crossorigin: "anonymous"
319
+ }, cusomize.attrs);
320
+ descriptors.push(__spreadProps(__spreadValues({
321
+ tag: "link"
322
+ }, cusomize), {
323
+ attrs
324
+ }));
325
+ });
326
+ });
327
+ return descriptors;
328
+ }
329
+ }
330
+ ];
331
+ if (isDev2 && enableInDevMode) {
332
+ plugins.push(
333
+ viteExternalsPlugin(externalMap, {
334
+ enforce: "pre"
335
+ })
336
+ );
337
+ }
338
+ return plugins;
339
+ }
340
+ var autoComplete2 = autoComplete_default;
341
+ var src_default = PluginImportToCDN;
342
+ export {
343
+ PluginImportToCDN as Plugin,
344
+ autoComplete2 as autoComplete,
345
+ src_default as default
346
+ };
package/package.json ADDED
@@ -0,0 +1,62 @@
1
+ {
2
+ "name": "@vearvip/vite-plugin-cdn-import",
3
+ "version": "1.0.2",
4
+ "description": "Import packages from CDN for the vite plugin",
5
+ "type": "module",
6
+ "main": "dist/index.js",
7
+ "module": "dist/index.js",
8
+ "types": "dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "import": "./dist/index.js",
12
+ "require": "./dist/index.cjs"
13
+ }
14
+ },
15
+ "keywords": [
16
+ "vite cdn plugin",
17
+ "vite CDN extension"
18
+ ],
19
+ "files": [
20
+ "dist"
21
+ ],
22
+ "publishConfig": {
23
+ "access": "public",
24
+ "registry": "https://registry.npmjs.org"
25
+ },
26
+ "repository": {
27
+ "type": "git",
28
+ "url": "git+https://github.com/vearvip/vite-plugin-cdn-import.git"
29
+ },
30
+ "scripts": {
31
+ "dev": "npm run build -- --watch",
32
+ "build": "tsup src/index.ts --dts --format cjs,esm",
33
+ "example": "node ./scripts/run-example.js",
34
+ "prepublishOnly": "npm run build",
35
+ "prepare": "husky"
36
+ },
37
+ "author": "vear<vear.vip@qq.com>",
38
+ "license": "MIT",
39
+ "devDependencies": {
40
+ "@types/node": "^20.12.7",
41
+ "chalk": "^5.3.0",
42
+ "execa": "^8.0.1",
43
+ "husky": "^9.0.11",
44
+ "lint-staged": "^15.2.2",
45
+ "prettier": "^3.2.5",
46
+ "tsup": "^8.0.2",
47
+ "typescript": "^5.4.5",
48
+ "vite": "^5.2.10"
49
+ },
50
+ "dependencies": {
51
+ "rollup-plugin-external-globals": "^0.10.0",
52
+ "vite-plugin-externals": "^0.6.2"
53
+ },
54
+ "lint-staged": {
55
+ "*.{ts,js,tsx,json,css,scss,less}": [
56
+ "prettier --write"
57
+ ],
58
+ "*.{scss,less}": [
59
+ "stylelint --fix"
60
+ ]
61
+ }
62
+ }