Ubuntu 24.04
Sponsored Link

Vue.js : स्थापित करना2025/02/28

 

Vue.js स्थापित करें जो एक JavaScript फ्रेमवर्क है।

[1]

Node.js स्थापित करें, यहाँ देखें

[2] एक सामान्य उपयोगकर्ता के साथ एक परीक्षण Vue.js अनुप्रयोग बनाएँ।
ubuntu@dlp:~$
npm install @vue/cli

up to date, audited 839 packages in 2s

76 packages are looking for funding
  run `npm fund` for details

// [testproject3] प्रोजेक्ट बनाएं

ubuntu@dlp:~$
./node_modules/.bin/vue create testproject3

.....
.....

Vue CLI v5.0.8
? Please pick a preset: Default ([Vue 3] babel, eslint)
Vue CLI v5.0.8
   Creating project in /home/ubuntu/testproject3.
   Initializing git repository...
   Installing CLI plugins. This might take a while...

.....
.....

  Successfully created project testproject3.
  Get started with the following commands:

 $ cd testproject3
 $ npm run serve

ubuntu@dlp:~$
cd testproject3

ubuntu@dlp:~/testproject3$
npm run serve


> testproject3@0.1.0 serve
> vue-cli-service serve

 INFO  Starting development server...
 DONE  Compiled successfully in 4025ms


  App running at:
  - Local:   http://localhost:8080/
  - Network: http://10.0.0.30:8080/

  Note that the development build is not optimized.
  To create a production build, run npm run build.
  किसी भी क्लाइंट कंप्यूटर से ऊपर कंसोल पर दिखाए गए URL तक पहुंच, और फिर यदि निम्न ऐप दिखाया जाता है तो यह ठीक है।
[3] आपके द्वारा बनाए गए परीक्षण अनुप्रयोग को संशोधित करें और जांचें कि यह काम करता है या नहीं।
ubuntu@dlp:~$
cd testproject3

ubuntu@dlp:~/testproject3$
vi src/components/HelloWorld.vue
<template>
  // टैग डालें
  <h1 style="font-size: 36px; color: red;">{{ MyHello }}</h1>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <p>


<script>
export default {
  name: 'HelloWorld',
  props: {
    msg: String,
    // [MyHello] स्ट्रिंग सेट करें
    MyHello: String
  }

ubuntu@dlp:~/testproject3$
vi src/App.vue
<template>
  <img alt="Vue logo" src="./assets/logo.png">
  // वह स्ट्रिंग सेट करें जिसे आप दिखाना चाहते हैं
  <HelloWorld MyHello="Hello Vue.js World!" msg="Welcome to Your Vue.js App"/>
</template>

ubuntu@dlp:~/testproject3$
npm run serve

मिलान सामग्री