VueJS - Thiết lập môi trường
Có nhiều cách để cài đặt VueJS. Một số cách về cách thực hiện cài đặt sẽ được thảo luận ở phần trước.
Sử dụng thẻ <script> trực tiếp trong tệp HTML
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body></body>
</html>
Đi đến trang chủ https://vuejs.org/v2/guide/installation.htmlcủa VueJS và tải xuống vue.js theo nhu cầu. Có hai phiên bản để sử dụng - phiên bản sản xuất và phiên bản phát triển. Phiên bản phát triển không được thu nhỏ, trong khi phiên bản sản xuất được thu nhỏ như thể hiện trong ảnh chụp màn hình sau. Phiên bản phát triển sẽ trợ giúp với các cảnh báo và chế độ gỡ lỗi trong quá trình phát triển dự án.
Sử dụng CDN
Chúng tôi cũng có thể bắt đầu sử dụng tệp VueJS từ thư viện CDN. Liên kếthttps://unpkg.com/vuesẽ cung cấp phiên bản mới nhất của VueJS. VueJS cũng có sẵn trên jsDelivr (https://cdn.jsdelivr.net/npm/vue/dist/vue.js) và cdnjs (https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.0/vue.js).
Chúng tôi có thể lưu trữ các tệp ở cuối của chúng tôi, nếu được yêu cầu và bắt đầu phát triển VueJS.
Sử dụng NPM
Đối với các ứng dụng quy mô lớn với VueJS, bạn nên cài đặt bằng gói npm. Nó đi kèm với Browserify và Webpack cùng với các công cụ cần thiết khác, giúp phát triển. Sau đây là lệnh cài đặt bằng npm.
npm install vue
Sử dụng dòng lệnh CLI
VueJS cũng cung cấp CLI để cài đặt vue và bắt đầu với việc kích hoạt máy chủ. Để cài đặt bằng CLI, chúng ta cần cài đặt CLI được thực hiện bằng lệnh sau.
npm install --global vue-cli
Sau khi hoàn tất, nó sẽ hiển thị phiên bản CLI cho VueJS. Quá trình cài đặt sẽ mất vài phút.
+ [email protected]
added 965 packages in 355.414s
Sau đây là lệnh tạo dự án bằng cách sử dụng Webpack.
vue init webpack myproject
Để bắt đầu, hãy sử dụng lệnh sau.
cd myproject
npm install
npm run dev
Khi chúng tôi thực thi npm run dev, nó khởi động máy chủ và cung cấp url để hiển thị trong trình duyệt, như thể hiện trong ảnh chụp màn hình sau.
Cấu trúc dự án sử dụng CLI trông giống như sau.