Source

ਟੂਲ ਬਣਾਓ

ਸਾਡੇ ਦਸਤਾਵੇਜ਼ਾਂ ਨੂੰ ਬਣਾਉਣ, ਸਰੋਤ ਕੋਡ ਨੂੰ ਕੰਪਾਇਲ ਕਰਨ, ਟੈਸਟਾਂ ਨੂੰ ਚਲਾਉਣ ਅਤੇ ਹੋਰ ਬਹੁਤ ਕੁਝ ਕਰਨ ਲਈ ਬੂਟਸਟਰੈਪ ਦੀਆਂ ਸ਼ਾਮਲ ਐਨਪੀਐਮ ਸਕ੍ਰਿਪਟਾਂ ਦੀ ਵਰਤੋਂ ਕਿਵੇਂ ਕਰਨੀ ਹੈ ਬਾਰੇ ਸਿੱਖੋ।

ਟੂਲਿੰਗ ਸੈੱਟਅੱਪ

ਬੂਟਸਟਰੈਪ ਆਪਣੇ ਬਿਲਡ ਸਿਸਟਮ ਲਈ npm ਸਕ੍ਰਿਪਟਾਂ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ। ਸਾਡੇ package.json ਵਿੱਚ ਫਰੇਮਵਰਕ ਦੇ ਨਾਲ ਕੰਮ ਕਰਨ ਲਈ ਸੁਵਿਧਾਜਨਕ ਤਰੀਕੇ ਸ਼ਾਮਲ ਹਨ, ਜਿਸ ਵਿੱਚ ਕੋਡ ਕੰਪਾਇਲ ਕਰਨਾ, ਟੈਸਟਾਂ ਨੂੰ ਚਲਾਉਣਾ ਅਤੇ ਹੋਰ ਬਹੁਤ ਕੁਝ ਸ਼ਾਮਲ ਹੈ।

ਸਾਡੇ ਬਿਲਡ ਸਿਸਟਮ ਦੀ ਵਰਤੋਂ ਕਰਨ ਅਤੇ ਸਾਡੇ ਦਸਤਾਵੇਜ਼ਾਂ ਨੂੰ ਸਥਾਨਕ ਤੌਰ 'ਤੇ ਚਲਾਉਣ ਲਈ, ਤੁਹਾਨੂੰ ਬੂਟਸਟਰੈਪ ਦੀਆਂ ਸਰੋਤ ਫਾਈਲਾਂ ਅਤੇ ਨੋਡ ਦੀ ਇੱਕ ਕਾਪੀ ਦੀ ਲੋੜ ਪਵੇਗੀ। ਇਹਨਾਂ ਕਦਮਾਂ ਦੀ ਪਾਲਣਾ ਕਰੋ ਅਤੇ ਤੁਹਾਨੂੰ ਰੌਕ ਕਰਨ ਲਈ ਤਿਆਰ ਹੋਣਾ ਚਾਹੀਦਾ ਹੈ:

  1. Node.js ਨੂੰ ਡਾਉਨਲੋਡ ਅਤੇ ਸਥਾਪਿਤ ਕਰੋ , ਜਿਸਦੀ ਵਰਤੋਂ ਅਸੀਂ ਆਪਣੀਆਂ ਨਿਰਭਰਤਾਵਾਂ ਦਾ ਪ੍ਰਬੰਧਨ ਕਰਨ ਲਈ ਕਰਦੇ ਹਾਂ।
  2. ਰੂਟ /bootstrapਡਾਇਰੈਕਟਰੀ 'ਤੇ ਨੈਵੀਗੇਟ ਕਰੋ ਅਤੇ package.jsonnpm install ਵਿੱਚ ਸੂਚੀਬੱਧ ਸਾਡੀਆਂ ਸਥਾਨਕ ਨਿਰਭਰਤਾਵਾਂ ਨੂੰ ਸਥਾਪਤ ਕਰਨ ਲਈ ਚਲਾਓ ।
  3. ਰੂਬੀ ਨੂੰ ਸਥਾਪਿਤ ਕਰੋ, ਬੰਡਲਰ ਨਾਲ ਸਥਾਪਿਤ ਕਰੋ gem install bundler, ਅਤੇ ਅੰਤ ਵਿੱਚ ਚਲਾਓ bundle install। ਇਹ ਸਾਰੀਆਂ ਰੂਬੀ ਨਿਰਭਰਤਾਵਾਂ ਨੂੰ ਸਥਾਪਿਤ ਕਰੇਗਾ, ਜਿਵੇਂ ਕਿ ਜੈਕੀਲ ਅਤੇ ਪਲੱਗਇਨ।
    • ਵਿੰਡੋਜ਼ ਉਪਭੋਗਤਾ: ਜੇਕੀਲ ਨੂੰ ਬਿਨਾਂ ਕਿਸੇ ਸਮੱਸਿਆ ਦੇ ਚਾਲੂ ਕਰਨ ਲਈ ਇਸ ਗਾਈਡ ਨੂੰ ਪੜ੍ਹੋ ।

ਪੂਰਾ ਹੋਣ 'ਤੇ, ਤੁਸੀਂ ਕਮਾਂਡ ਲਾਈਨ ਤੋਂ ਪ੍ਰਦਾਨ ਕੀਤੀਆਂ ਵੱਖ-ਵੱਖ ਕਮਾਂਡਾਂ ਨੂੰ ਚਲਾਉਣ ਦੇ ਯੋਗ ਹੋਵੋਗੇ।

npm ਸਕ੍ਰਿਪਟਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨਾ

ਸਾਡੇ package.json ਵਿੱਚ ਹੇਠ ਲਿਖੀਆਂ ਕਮਾਂਡਾਂ ਅਤੇ ਕਾਰਜ ਸ਼ਾਮਲ ਹਨ:

ਟਾਸਕ ਵਰਣਨ
npm run dist npm run dist/dist/ਕੰਪਾਇਲ ਕੀਤੀਆਂ ਫਾਈਲਾਂ ਨਾਲ ਡਾਇਰੈਕਟਰੀ ਬਣਾਉਂਦਾ ਹੈ . Sass , Autoprefixer , ਅਤੇ UglifyJS ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ।
npm test ਇਸ ਤੋਂ ਇਲਾਵਾ ਇਹ ਸਥਾਨਕ ਤੌਰ npm run dist'ਤੇ ਟੈਸਟ ਚਲਾਉਂਦਾ ਹੈ
npm run docs ਡੌਕਸ ਲਈ CSS ਅਤੇ JavaScript ਬਣਾਉਂਦਾ ਅਤੇ ਲਿੰਟ ਕਰਦਾ ਹੈ। ਤੁਸੀਂ ਫਿਰ ਦਸਤਾਵੇਜ਼ਾਂ ਨੂੰ ਸਥਾਨਕ ਤੌਰ 'ਤੇ ਰਾਹੀਂ ਚਲਾ ਸਕਦੇ ਹੋ npm run docs-serve

npm runਸਾਰੀਆਂ npm ਸਕ੍ਰਿਪਟਾਂ ਨੂੰ ਦੇਖਣ ਲਈ ਚਲਾਓ ।

ਆਟੋਪ੍ਰੀਫਿਕਸਰ

ਬੂਟਸਟਰੈਪ ਬਿਲਡ ਸਮੇਂ 'ਤੇ ਕੁਝ CSS ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਵਿੱਚ ਵਿਕਰੇਤਾ ਪ੍ਰੀਫਿਕਸ ਨੂੰ ਆਪਣੇ ਆਪ ਜੋੜਨ ਲਈ ਆਟੋਪ੍ਰੀਫਿਕਸਰ (ਸਾਡੀ ਬਿਲਡ ਪ੍ਰਕਿਰਿਆ ਵਿੱਚ ਸ਼ਾਮਲ) ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ। ਅਜਿਹਾ ਕਰਨ ਨਾਲ ਸਾਨੂੰ ਸਾਡੇ CSS ਦੇ ਮੁੱਖ ਭਾਗਾਂ ਨੂੰ ਇੱਕ ਵਾਰ ਲਿਖਣ ਦੀ ਇਜਾਜ਼ਤ ਦੇ ਕੇ ਸਾਡੇ ਸਮੇਂ ਅਤੇ ਕੋਡ ਦੀ ਬਚਤ ਹੁੰਦੀ ਹੈ ਜਦੋਂ ਕਿ v3 ਵਿੱਚ ਪਾਏ ਗਏ ਵਿਕਰੇਤਾ ਮਿਸ਼ਰਣਾਂ ਦੀ ਲੋੜ ਨੂੰ ਖਤਮ ਕਰਦੇ ਹੋਏ।

ਅਸੀਂ ਸਾਡੀ GitHub ਰਿਪੋਜ਼ਟਰੀ ਦੇ ਅੰਦਰ ਇੱਕ ਵੱਖਰੀ ਫਾਈਲ ਵਿੱਚ ਆਟੋਪ੍ਰੀਫਿਕਸਰ ਦੁਆਰਾ ਸਮਰਥਿਤ ਬ੍ਰਾਉਜ਼ਰਾਂ ਦੀ ਸੂਚੀ ਬਣਾਈ ਰੱਖਦੇ ਹਾਂ। ਵੇਰਵਿਆਂ ਲਈ .browserslistrc ਵੇਖੋ ।

ਸਥਾਨਕ ਦਸਤਾਵੇਜ਼

ਸਾਡੇ ਦਸਤਾਵੇਜ਼ਾਂ ਨੂੰ ਸਥਾਨਕ ਤੌਰ 'ਤੇ ਚਲਾਉਣ ਲਈ ਜੇਕੀਲ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ, ਇੱਕ ਵਧੀਆ ਢੰਗ ਨਾਲ ਲਚਕਦਾਰ ਸਥਿਰ ਸਾਈਟ ਜਨਰੇਟਰ ਜੋ ਸਾਨੂੰ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ: ਬੁਨਿਆਦੀ ਸ਼ਾਮਲ ਹਨ, ਮਾਰਕਡਾਊਨ-ਅਧਾਰਿਤ ਫਾਈਲਾਂ, ਟੈਂਪਲੇਟਸ, ਅਤੇ ਹੋਰ ਬਹੁਤ ਕੁਝ। ਇਸਨੂੰ ਸ਼ੁਰੂ ਕਰਨ ਦਾ ਤਰੀਕਾ ਇੱਥੇ ਹੈ:

  1. ਜੇਕੀਲ (ਸਾਈਟ ਬਿਲਡਰ) ਅਤੇ ਹੋਰ ਰੂਬੀ ਨਿਰਭਰਤਾਵਾਂ ਨੂੰ ਸਥਾਪਿਤ ਕਰਨ ਲਈ ਉੱਪਰ ਟੂਲਿੰਗ ਸੈੱਟਅੱਪ ਰਾਹੀਂ ਚਲਾਓ bundle install
  2. ਰੂਟ /bootstrapਡਾਇਰੈਕਟਰੀ ਤੋਂ, npm run docs-serveਕਮਾਂਡ ਲਾਈਨ ਵਿੱਚ ਚਲਾਓ।
  3. ਆਪਣੇ ਬਰਾਊਜ਼ਰ ਵਿੱਚ ਖੋਲ੍ਹੋ http://localhost:9001, ਅਤੇ voilà.

ਇਸ ਦੇ ਦਸਤਾਵੇਜ਼ਾਂ ਨੂੰ ਪੜ੍ਹ ਕੇ ਜੇਕੀਲ ਦੀ ਵਰਤੋਂ ਕਰਨ ਬਾਰੇ ਹੋਰ ਜਾਣੋ ।

ਸਮੱਸਿਆ ਨਿਪਟਾਰਾ

ਜੇਕਰ ਤੁਹਾਨੂੰ ਨਿਰਭਰਤਾ ਸਥਾਪਤ ਕਰਨ ਵਿੱਚ ਸਮੱਸਿਆਵਾਂ ਆਉਂਦੀਆਂ ਹਨ, ਤਾਂ ਸਾਰੇ ਪਿਛਲੇ ਨਿਰਭਰਤਾ ਸੰਸਕਰਣਾਂ (ਗਲੋਬਲ ਅਤੇ ਸਥਾਨਕ) ਨੂੰ ਅਣਇੰਸਟੌਲ ਕਰੋ। ਫਿਰ, ਦੁਬਾਰਾ ਚਲਾਓ npm install.