ಉಪಕರಣಗಳನ್ನು ನಿರ್ಮಿಸಿ
ನಮ್ಮ ದಸ್ತಾವೇಜನ್ನು ನಿರ್ಮಿಸಲು, ಮೂಲ ಕೋಡ್ ಅನ್ನು ಕಂಪೈಲ್ ಮಾಡಲು, ಪರೀಕ್ಷೆಗಳನ್ನು ಚಲಾಯಿಸಲು ಮತ್ತು ಹೆಚ್ಚಿನದನ್ನು ಮಾಡಲು ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್‌ನ ಒಳಗೊಂಡಿರುವ npm ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳನ್ನು ಹೇಗೆ ಬಳಸುವುದು ಎಂದು ತಿಳಿಯಿರಿ.
ಟೂಲಿಂಗ್ ಸೆಟಪ್
ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ತನ್ನ ನಿರ್ಮಾಣ ವ್ಯವಸ್ಥೆಗಾಗಿ NPM ಸ್ಕ್ರಿಪ್ಟ್‌ಗಳನ್ನು ಬಳಸುತ್ತದೆ. ಕೋಡ್ ಅನ್ನು ಕಂಪೈಲ್ ಮಾಡುವುದು, ಚಾಲನೆಯಲ್ಲಿರುವ ಪರೀಕ್ಷೆಗಳು ಮತ್ತು ಹೆಚ್ಚಿನವುಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ಫ್ರೇಮ್‌ವರ್ಕ್‌ನೊಂದಿಗೆ ಕೆಲಸ ಮಾಡಲು ನಮ್ಮ ಪ್ಯಾಕೇಜ್ .json ಅನುಕೂಲಕರ ವಿಧಾನಗಳನ್ನು ಒಳಗೊಂಡಿದೆ.
ನಮ್ಮ ಬಿಲ್ಡ್ ಸಿಸ್ಟಮ್ ಅನ್ನು ಬಳಸಲು ಮತ್ತು ನಮ್ಮ ದಸ್ತಾವೇಜನ್ನು ಸ್ಥಳೀಯವಾಗಿ ಚಲಾಯಿಸಲು, ನಿಮಗೆ ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್‌ನ ಮೂಲ ಫೈಲ್‌ಗಳು ಮತ್ತು ನೋಡ್‌ನ ನಕಲು ಅಗತ್ಯವಿದೆ. ಈ ಹಂತಗಳನ್ನು ಅನುಸರಿಸಿ ಮತ್ತು ನೀವು ರಾಕ್ ಮಾಡಲು ಸಿದ್ಧರಾಗಿರಬೇಕು:
- ನಮ್ಮ ಅವಲಂಬನೆಗಳನ್ನು ನಿರ್ವಹಿಸಲು ನಾವು ಬಳಸುವ Node.js ಅನ್ನು ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ ಮತ್ತು ಸ್ಥಾಪಿಸಿ .
/bootstrapಮೂಲ ಡೈರೆಕ್ಟರಿಗೆ ನ್ಯಾವಿಗೇಟ್ ಮಾಡಿ ಮತ್ತು ಪ್ಯಾಕೇಜ್npm install.json ನಲ್ಲಿ ಪಟ್ಟಿ ಮಾಡಲಾದ ನಮ್ಮ ಸ್ಥಳೀಯ ಅವಲಂಬನೆಗಳನ್ನು ಸ್ಥಾಪಿಸಲು ರನ್ ಮಾಡಿ .- ರೂಬಿ ಅನ್ನು ಸ್ಥಾಪಿಸಿ , ಬಂಡ್ಲರ್ ಅನ್ನು ಸ್ಥಾಪಿಸಿ
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 ನೋಡಿ .
ಸ್ಥಳೀಯ ದಾಖಲಾತಿ
ನಮ್ಮ ದಸ್ತಾವೇಜನ್ನು ಸ್ಥಳೀಯವಾಗಿ ಚಲಾಯಿಸಲು ನಮಗೆ ಒದಗಿಸುವ ಯೋಗ್ಯವಾಗಿ ಹೊಂದಿಕೊಳ್ಳುವ ಸ್ಥಿರ ಸೈಟ್ ಜನರೇಟರ್ ಜೆಕಿಲ್‌ನ ಬಳಕೆಯ ಅಗತ್ಯವಿದೆ: ಮೂಲಭೂತ ಒಳಗೊಂಡಿದೆ, ಮಾರ್ಕ್‌ಡೌನ್-ಆಧಾರಿತ ಫೈಲ್‌ಗಳು, ಟೆಂಪ್ಲೇಟ್‌ಗಳು ಮತ್ತು ಹೆಚ್ಚಿನವು. ಇದನ್ನು ಹೇಗೆ ಪ್ರಾರಂಭಿಸುವುದು ಎಂಬುದು ಇಲ್ಲಿದೆ:
- ಜೆಕಿಲ್ (ಸೈಟ್ ಬಿಲ್ಡರ್) ಮತ್ತು ಇತರ ರೂಬಿ ಅವಲಂಬನೆಗಳನ್ನು ಸ್ಥಾಪಿಸಲು ಮೇಲಿನ ಟೂಲಿಂಗ್ ಸೆಟಪ್ ಮೂಲಕ ರನ್ ಮಾಡಿ
bundle install. - ಮೂಲ
/bootstrapಡೈರೆಕ್ಟರಿಯಿಂದ,npm run docs-serveಆಜ್ಞಾ ಸಾಲಿನಲ್ಲಿ ರನ್ ಮಾಡಿ. - ನಿಮ್ಮ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ತೆರೆಯಿರಿ
http://localhost:9001ಮತ್ತು voilà.
ಅದರ ದಸ್ತಾವೇಜನ್ನು ಓದುವ ಮೂಲಕ ಜೆಕಿಲ್ ಅನ್ನು ಬಳಸುವ ಬಗ್ಗೆ ಇನ್ನಷ್ಟು ತಿಳಿಯಿರಿ .
ದೋಷನಿವಾರಣೆ
ಅವಲಂಬನೆಗಳನ್ನು ಸ್ಥಾಪಿಸುವಲ್ಲಿ ನೀವು ಸಮಸ್ಯೆಗಳನ್ನು ಎದುರಿಸಿದರೆ, ಹಿಂದಿನ ಎಲ್ಲಾ ಅವಲಂಬನೆ ಆವೃತ್ತಿಗಳನ್ನು (ಜಾಗತಿಕ ಮತ್ತು ಸ್ಥಳೀಯ) ಅಸ್ಥಾಪಿಸಿ. ನಂತರ, ಮರುಚಾಲನೆ ಮಾಡಿ npm install.