தொடங்குதல் Nuxt.js: நிறுவல், கட்டமைப்பு மற்றும் முதல் பக்கம்

Nuxt.js ஒரு திட்டத்தை நிறுவுதல் மற்றும் கட்டமைத்தல்

Node.js ஐ நிறுவவும்

உங்கள் கணினியில் Node.js நிறுவப்பட்டுள்ளதா என்பதை உறுதிப்படுத்திக் கொள்ளுங்கள். அதிகாரப்பூர்வ Node.js இணையதளத்திலிருந்து சமீபத்திய பதிப்பைப் பதிவிறக்கலாம்.

Vue CLI ஐ நிறுவவும்

Vue CLI ஐ நிறுவ உங்கள் Terminal அல்லது Command Prompt பின்வரும் கட்டளையை இயக்கவும்(ஏற்கனவே நிறுவப்படவில்லை என்றால்):

npm install -g vue-cli

Nuxt.js ஒரு திட்டத்தை உருவாக்கவும்

இல் Terminal, உங்கள் திட்டத்தை உருவாக்க விரும்பும் கோப்பகத்திற்குச் சென்று ஒரு Nuxt.js திட்டத்தை உருவாக்க பின்வரும் கட்டளையை இயக்கவும்:

vue init nuxt-community/starter-template my-nuxt-project

திட்ட கட்டமைப்பு

Terminal உங்கள் திட்டத்தை உள்ளமைக்க, இல் உள்ள கட்டளைகளைப் பின்பற்றவும். உங்கள் திட்டத்திற்கான ESLint ஐப் பயன்படுத்துதல், நிறுவுதல் போன்ற பல்வேறு விருப்பங்களை நீங்கள் தேர்வு செய்யலாம் Axios.

முதல் பக்கத்தை உருவாக்குதல் மற்றும் அடிப்படை உள்ளடக்கத்தைக் காண்பித்தல்:

திட்டக் கோப்பகத்தைத் திறக்கவும்

Terminal கட்டளையைப் cd my-nuxt-project(அல்லது நீங்கள் தேர்ந்தெடுத்த கோப்புறையின் பெயரை) பயன்படுத்தி உங்கள் திட்டத்தைத் திறந்து திட்டக் கோப்பகத்திற்குச் செல்லவும்.

புதிய பக்கத்தை உருவாக்கவும்

பின்வரும் கட்டளையுடன் புதிய பக்கத்தை உருவாக்க Vue CLI ஐப் பயன்படுத்தவும்:

npx vue-cli-service generate page mypage

புதிய பக்கத்தைத் திருத்தவும்

mypage.vue கோப்பகத்தில் கோப்பைத் திறந்து pages பக்கத்தின் உள்ளடக்கத்தைத் திருத்தவும். நீங்கள் HTML, Vue கூறுகள் மற்றும் தரவைச் சேர்க்கலாம்.

பக்கத்தைக் காட்டு

கோப்பில், பக்கத்தின் உள்ளடக்கத்தைக் காட்ட குறிச்சொல்லைப் layouts/default.vue பயன்படுத்தலாம். <nuxt/>

திட்டத்தை இயக்கவும்

இல் Terminal, திட்டத்தைத் தொடங்க பின்வரும் கட்டளையை இயக்கவும் மற்றும் உலாவியில் உங்கள் பக்கத்தைப் பார்க்கவும்:

npm run dev

இப்போது நீங்கள் திட்டத்தில் உங்கள் முதல் பக்கம் உள்ளது Nuxt.js மற்றும் விரும்பியபடி உள்ளடக்கத்தைத் தனிப்பயனாக்கலாம்.