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 ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ ਤੁਹਾਡਾ ਪਹਿਲਾ ਪੰਨਾ ਹੈ ਅਤੇ ਤੁਸੀਂ ਲੋੜ ਅਨੁਸਾਰ ਸਮੱਗਰੀ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰ ਸਕਦੇ ਹੋ।