Cách cài đặt Vue CLI trên Ubuntu 20.04

Trong bài viết này, chúng tôi sẽ giải thích cách cài đặt Vue CLI trên Ubuntu 20.04.

Vue.js là một khung JavaScript giao diện người dùng model-view-viewmodel mã nguồn mở. Bài viết này sẽ hướng dẫn các bạn quá trình cài đặt và tạo dự án hello world first.

Điều kiện tiên quyết

• Một máy chủ chuyên dụng được cài đặt Ubuntu 20.04 hoặc KVM VPS.
• Quyền truy cập của người dùng root hoặc người dùng bình thường có đặc quyền quản trị.

Cài đặt Vue CLI trên Ubuntu 20.04

1 - Giữ cho máy chủ được cập nhật

# apt update -y

2 - Tải xuống NodeJS

Tải xuống bản phát hành ổn định mới nhất của NodeJS.

# curl -sL https://deb.nodesource.com/setup_15.x | sudo -E bash -

3 - Cài đặt NodeJS

Tiếp theo, cài đặt NodeJS bằng lệnh sau:

# apt-get install -y nodejs

4 - Xác minh cài đặt

# node -v && npm -v

Đầu ra:

v15.9.0
7.5.4

5. Cài đặt Vue CLI

Lệnh sau sẽ cài đặt Vue CLI.

# npm install -g @vue/cli

Xác minh cài đặt:

# vue --version

Đầu ra:

@vue/cli 4.5.11

6. Tạo dự án Vue

# vue create hello-world

Bạn sẽ được nhắc chọn một giá trị đặt trước. Bạn có thể chọn cài đặt trước mặc định đi kèm với thiết lập Babel + ESLint cơ bản hoặc chọn "Chọn các tính năng theo cách thủ công" để chọn các tính năng bạn cần.

Đầu ra:

Vue CLI v4.5.11
? Please pick a preset: (Use arrow keys)
❯ Default ([Vue 2] babel, eslint)
Default (Vue 3 Preview) ([Vue 3] babel, eslint)
Manually select features

Đã tạo thành công dự án hello-world.
Bắt đầu với các lệnh sau:

# cd hello-world
# npm run serve

Đầu ra:

App running at:
- Local: http://localhost:8080/
- Network: http://192.168.0.106:8080/

Note that the development build is not optimized.
To create a production build, run npm run build.

Điều hướng đến trình duyệt của bạn và mở http: // [server_IP]: 8080.

Đó là nó. Quá trình cài đặt đã hoàn tất.

Trong bài viết này, chúng tôi đã giới thiệu cho các bạn cách cài đặt Vue CLI trên Ubuntu 20.04.