CDN Setup करना
CDN build आपको कुछ भी install किए बिना किसी भी HTML page पर Vue इस्तेमाल करने देती है।
In this page:
Syntax
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
const { createApp } = Vue;
</script>
CDN Setup
unpkg या jsDelivr जैसे एक CDN से global build include करें। यह createApp और दूसरे helpers वाला एक global Vue object expose करता है। page के अंदर templates browser में compile होते हैं, जो सीखने और छोटे enhancements के लिए convenient है।
Note:
stable pages के लिए URL में version pin करें, उदाहरण के लिए [email protected]।
उदाहरण: CDN setup
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head>
<body>
<div id="app">Vue is loaded: {{ loaded }} (version 3: {{ isV3 }})</div>
<script>
Vue.createApp({
data() {
return { loaded: typeof Vue.createApp === "function", isV3: Vue.version.startsWith("3") };
},
}).mount("#app");
</script>
</body>
</html>
<!-- Output:
Rendered: Vue is loaded: true (version 3: true)
-->
Live Example
Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}
आम गलतियां
- script tag भूल जाना
- अपने खुद के script के बाद Vue load करना
- debug करते वक्त production build इस्तेमाल करना
चैप्टर सारांश
- Global build script add करें
- यह Vue global define करता है
- अपने code से पहले इसे load करें
- Production में versions pin करें
🔒
Chapter Quiz — Complete all 7 topics to unlock
0/7 topics done
Complete these topics first: