vite-plugin-cdn icon indicating copy to clipboard operation
vite-plugin-cdn copied to clipboard

vite-plugin-cdn2: vue Maximum call stack size exceeded

Open Bisstocuz opened this issue 2 years ago • 4 comments

cdn({
	modules: [{ name: "vue", relativeModule: "vue.global.prod.min.js" }, "vue-router", "vue-demi", "pinia", "axios" ],
	resolve: defineResolve({
		name: "resolve:custom",
		setup({ extra }) {
			const baseURL = "https://cdn.staticfile.net/";
			const { version, name, relativeModule } = extra;
			const url = new URL(`${name}/${version}/${relativeModule}`, baseURL);
			return {
				url: url.href,
				injectTo: "head-prepend",
				attrs: {
					crossOrigin: 'anonymous'
				},
			};
		},
	})
})

And there is no vue in output:

<script crossOrigin="anonymous" src="https://cdn.staticfile.net/vue-router/4.2.0/dist/vue-router.global.js"></script>
<script crossOrigin="anonymous" src="https://cdn.staticfile.net/vue-demi/0.14.6/lib/index.iife.js"></script>
<script crossOrigin="anonymous" src="https://cdn.staticfile.net/pinia/2.1.7/dist/pinia.iife.js"></script>
<script crossOrigin="anonymous" src="https://cdn.staticfile.net/axios/1.5.0/dist/axios.min.js"></script>

Bisstocuz avatar Apr 10 '24 10:04 Bisstocuz

relativeModule means the package root path.Usually contain package.json. AFAIK vue bundle asserts contain dist directory. I might think u can try "./dist/xxx"? Another way to change it you can do your logic in plugin system.

nonzzz avatar Apr 10 '24 11:04 nonzzz

relativeModule means the package root path.Usually contain package.json. AFAIK vue bundle asserts contain dist directory. I might think u can try "./dist/xxx"? Another way to change it you can do your logic in plugin system.

My code was modeled after this docs

The path of assets doesn't always include dist, for example, check this: https://cdnjs.com/libraries/vue

Could you please provide a simple example about how to change this behavior?

Bisstocuz avatar Apr 11 '24 02:04 Bisstocuz

relativeModule is use for code block. Notice you relativeModule is vue.global.prod.min.js isn't be pass.

You can get package name in setup. so you just using the follow logic.


if (name === 'vue') {

// do your logic.

return 

}

... etc

nonzzz avatar Apr 11 '24 05:04 nonzzz

I've been busy recently. Some of logic and document isn't friendly. I create a new branch to redesign some of logic.

nonzzz avatar Apr 11 '24 05:04 nonzzz