Npm chạy xây dựng NodeJS

Thông thường có hai loại công cụ xây dựng JavaScript. trình chạy tác vụ và trình đóng gói mô-đun. Trong bài viết này, chúng ta sẽ xem xét cách sử dụng các tập lệnh xây dựng npm cụ thể của dự án làm công cụ xây dựng và trình chạy tác vụ, thay vì dựa vào các trình chạy tác vụ như Gulp và Grunt hoặc các gói mô-đun như Webpack

Grunt và Gulp là các trình chạy tác vụ, chúng tự động hóa các tác vụ thủ công định kỳ trong quá trình phát triển. Mặt khác, Webpack là một gói mô-đun lấy các đoạn mã ứng dụng riêng biệt, mỗi đoạn có các phụ thuộc riêng và gộp chúng vào các nội dung tĩnh

Trong bài viết về Grunt và Gulp của chúng tôi, chúng tôi đã đề cập đến một giải pháp thay thế công cụ xây dựng khác mà chúng tôi chưa thực sự đi sâu vào. tập lệnh npm. Một số bạn đã hỏi rằng bạn muốn biết thêm về cách bạn có thể sử dụng tập lệnh npm làm công cụ xây dựng/trình chạy tác vụ, vì vậy đó chính xác là những gì chúng ta sẽ xem xét

Tại sao lại là Npm Script?

Nếu bạn sử dụng các công cụ xây dựng như Grunt, Gulp và Webpack đủ lâu, bạn sẽ bắt đầu thấy rằng mình bắt đầu chiến đấu với công cụ này hơn là tập trung vào việc viết mã cho ứng dụng của mình. Mỗi công cụ có cách thức hoạt động riêng và điều đó có nghĩa là mỗi công cụ đều có những đặc điểm và vấn đề riêng cần được học

Cả Grunt và Gulp đều phụ thuộc rất nhiều vào việc sử dụng plugin để thêm chức năng và hầu hết các plugin đó đều là trình bao bọc xung quanh các gói npm hiện có. Điều này có thể dẫn đến các vấn đề như

  1. Không có plugin cho gói bạn muốn sử dụng
  2. Plugin đã lỗi thời và không hỗ trợ đúng gói bên dưới
  3. Plugin không hỗ trợ tính năng mà bạn muốn sử dụng cho gói cơ bản
  4. Tài liệu plugin còn thiếu hoặc không rõ ràng
  5. Plugin không xử lý lỗi tốt

Vì hầu hết các gói thường có CLI, một giải pháp đơn giản cho những vấn đề này là loại bỏ hoàn toàn sự trừu tượng hóa (đôi khi phức tạp) của các công cụ xây dựng và chạy các gói cơ bản theo cách thủ công trên dòng lệnh. Đây là một giải pháp tuyệt vời, nhưng làm thế nào để bạn nhớ tất cả các lệnh CLI đó và các tùy chọn của chúng?

Tập lệnh Npm

Nhập các tập lệnh npm, đã có từ ít nhất là phiên bản 6 của npm. Sử dụng thuộc tính

sass assets/scss/style.scss dist/css/style.csss
3 trong tệp
sass assets/scss/style.scss dist/css/style.csss
4 của bạn, có thể xác định các tập lệnh tùy chỉnh để chạy các lệnh CLI khác nhau. Điều này rất giống với công cụ GNU Make, được các nhà phát triển ứng dụng máy tính để bàn sử dụng cho các hệ thống giống Unix để xây dựng và quản lý ứng dụng của họ

Sau khi bạn xác định

sass assets/scss/style.scss dist/css/style.csss
3 trong
sass assets/scss/style.scss dist/css/style.csss
4 của mình, npm có một lệnh chạy có thể thực thi các tập lệnh này. Nếu bạn đã từng sử dụng một gói yêu cầu bạn chạy lệnh như
sass assets/scss/style.scss dist/css/style.csss
7 hoặc
sass assets/scss/style.scss dist/css/style.csss
8, thì bạn đã sử dụng tập lệnh npm

Một tập lệnh có thể đơn giản như một lệnh đầu cuối hoặc một chuỗi lệnh phức tạp hơn cần được chạy theo một thứ tự cụ thể

Để sử dụng tập lệnh npm làm công cụ xây dựng, chúng tôi sẽ xác định một loạt tập lệnh trong tệp

sass assets/scss/style.scss dist/css/style.csss
4, tương tự như xác định tác vụ chúng tôi muốn chạy trong tệp cấu hình trong các công cụ xây dựng khác. Sự khác biệt với các tập lệnh npm là chúng tôi sẽ chạy gói CLI mà không cần bất kỳ plugin nào, sau đó xâu chuỗi các tập lệnh lại với nhau để chúng tôi có thể kích hoạt bản dựng bằng một lệnh duy nhất. Đối với mục đích trình diễn, chúng tôi sẽ tạo lại cùng một quy trình xây dựng mà chúng tôi đã sử dụng trong

  1. Biên dịch Sass sang CSS
  2. Nối và rút gọn CSS và JavaScript
  3. Tối ưu hóa hình ảnh

Dự án mẫu

Chúng tôi đã tạo một kho lưu trữ GitHub dưới dạng bản demo cho những gì chúng tôi đang thử nghiệm tại đây. Nó có một

sass assets/scss/style.scss dist/css/style.csss
4 được cấu hình sẵn, bao gồm tất cả các gói npm mà chúng tôi đang sử dụng

  1. ngổ ngáo. được sử dụng để chuyển đổi Sass sang CSS
  2. concat. được sử dụng để nối (nối) nhiều tệp
  3. sạch-css-cli. cli cho clean-css, trình tối ưu hóa CSS nhanh và hiệu quả
  4. làm xấu xí-js. Trình phân tích cú pháp JavaScript, trình rút gọn, trình nén và trình làm đẹp
  5. trao đổi. xem các tập hợp tệp và chạy lệnh khi có bất kỳ thứ gì được thêm, thay đổi hoặc xóa
  6. npm-run-all. chạy nhiều tập lệnh npm song song hoặc tuần tự
  7. @squoosh/cli. một cli cho , trình tối ưu hóa hình ảnh

Gói

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
1 là gói thay thế cho gói
"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
2 mà chúng ta đã sử dụng trong bài viết Grunt vs Gulp, do gói
"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
3 không còn được duy trì

Kho lưu trữ cũng chứa tất cả các tệp cần thiết và nội dung demo, vì vậy bạn có thể sử dụng nó để thử nghiệm các tập lệnh npm mà chúng tôi sẽ thiết lập

Tạo tập lệnh đầu tiên của bạn

Đối với

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
4 đầu tiên của chúng tôi, hãy bắt đầu bằng cách biên dịch tệp Sass của chúng tôi thành CSS bằng cách sử dụng gói sass. Đầu tiên chúng ta cần cài đặt nó

sass assets/scss/style.scss dist/css/style.csss
2

Thao tác này sẽ cài đặt gói trong thư mục

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
5 của bạn. Lưu ý rằng cờ
"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
6 lưu gói này trong phần
"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
7 của tệp
sass assets/scss/style.scss dist/css/style.csss
4. Điều này giúp các nhà phát triển khác dễ dàng cài đặt các gói cần thiết trong tương lai chỉ bằng cách chạy
"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
9

Theo hướng dẫn sử dụng công cụ dòng lệnh sass, chúng ta có thể biên dịch tệp

sass assets/scss/style.scss dist/css/style.csss
80 của mình thành
sass assets/scss/style.scss dist/css/style.csss
81 bằng lệnh sau

sass assets/scss/style.scss dist/css/style.csss

Vì vậy, hãy thêm lệnh này dưới dạng tập lệnh

sass assets/scss/style.scss dist/css/style.csss
82 có tên là
sass assets/scss/style.scss dist/css/style.csss
83 vào tệp
sass assets/scss/style.scss dist/css/style.csss
4 của chúng tôi trong phần
sass assets/scss/style.scss dist/css/style.csss
3

________số 8

Bây giờ hãy chạy

sass assets/scss/style.scss dist/css/style.csss
86 từ dòng lệnh. Bạn sẽ thấy tệp Sass của mình được biên dịch thành công thành CSS và đầu ra của lệnh sẽ giống như đang chạy thủ công
sass assets/scss/style.scss dist/css/style.csss
87

sass assets/scss/style.scss dist/css/style.csss
8

Quá trình này sau đó có thể được lặp lại cho phần còn lại của các yêu cầu dự án của chúng tôi

Lệnh kiểm tra

Nếu bạn thấy rằng tập lệnh không hoạt động như mong đợi, bạn có thể kiểm tra lệnh được liên kết theo cách thủ công từ thiết bị đầu cuối của mình bằng cách sử dụng lệnh

sass assets/scss/style.scss dist/css/style.csss
88. Lệnh này cho phép bạn chạy bất kỳ lệnh tùy ý nào khác từ gói được cài đặt cục bộ

Để kiểm tra lệnh cho tập lệnh

sass assets/scss/style.scss dist/css/style.csss
83 với
sass assets/scss/style.scss dist/css/style.csss
88, bạn có thể chạy nó như thế này

sass assets/scss/style.scss dist/css/style.csss
2

Thêm nhiều tập lệnh hơn

Chúng tôi có thể làm theo quy trình tương tự cho bất kỳ tập lệnh bổ sung nào mà chúng tôi muốn thêm

  1. Cài đặt gói bằng cách sử dụng
    sass assets/scss/style.scss dist/css/style.csss
    
    82
  2. Định cấu hình tập lệnh trong phần
    sass assets/scss/style.scss dist/css/style.csss
    
    3 của tệp
    sass assets/scss/style.scss dist/css/style.csss
    
    4, để chạy lệnh đầu cuối có liên quan

Chuỗi kịch bản

Cũng có thể xâu chuỗi các tập lệnh lại với nhau. Điều này là do bản thân

sass assets/scss/style.scss dist/css/style.csss
24 là một lệnh CLI và nó có thể được chạy từ các tập lệnh khác. Ví dụ

sass assets/scss/style.scss dist/css/style.csss
7

Ở đây, chúng tôi đã tạo hai tập lệnh riêng biệt,

sass assets/scss/style.scss dist/css/style.csss
25 và
sass assets/scss/style.scss dist/css/style.csss
26, nối các tệp CSS và JS của chúng tôi bằng lệnh
sass assets/scss/style.scss dist/css/style.csss
27. Chúng ta có thể chạy chúng một cách riêng biệt, nhưng thông thường sẽ rất hữu ích nếu có thể chạy chúng dưới dạng một lệnh duy nhất. Chúng tôi có thể làm như vậy bằng cách tạo tập lệnh
sass assets/scss/style.scss dist/css/style.csss
27 mới chạy cả hai tập lệnh bằng cách sử dụng
sass assets/scss/style.scss dist/css/style.csss
24

Tập lệnh nhóm

Khi chúng tôi đã cài đặt tất cả các gói cần thiết, phần

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
7 của
sass assets/scss/style.scss dist/css/style.csss
4 của chúng tôi sẽ trông giống như thế này

sass assets/scss/style.scss dist/css/style.csss
5

Tôi sẽ không đi vào chi tiết tất cả các tập lệnh mà chúng ta đã định cấu hình trong dự án ví dụ, nhưng bây giờ bạn đã biết cách thức hoạt động của các tập lệnh npm, có lẽ bạn có thể hiểu được chức năng của từng tập lệnh sau đây.

sass assets/scss/style.scss dist/css/style.csss
7

Phần quan trọng mà tôi muốn nhấn mạnh là ở dưới cùng, nơi chúng tôi đã tạo các tập lệnh

sass assets/scss/style.scss dist/css/style.csss
73 cho các nhóm tập lệnh riêng lẻ (
sass assets/scss/style.scss dist/css/style.csss
74,
sass assets/scss/style.scss dist/css/style.csss
75,
sass assets/scss/style.scss dist/css/style.csss
76) và sau đó xâu chuỗi chúng lại với nhau trong một tập lệnh duy nhất có tên là
sass assets/scss/style.scss dist/css/style.csss
73. Việc chia nhỏ mọi thứ thành các nhóm hợp lý không chỉ giúp dễ dàng xâu chuỗi các tập lệnh lại với nhau mà còn hữu ích khi bạn chỉ muốn biên dịch một nhóm nội dung nhất định của mình. Ví dụ, theo dõi những thay đổi

Theo dõi những thay đổi

Khả năng biên dịch tất cả nội dung giao diện người dùng của bạn bằng một lệnh

sass assets/scss/style.scss dist/css/style.csss
78 duy nhất rất hữu ích, nhưng nó sẽ nhanh chóng gây khó chịu nếu bạn cần chạy nó sau mỗi lần bạn thay đổi một phần mã của mình. Trong những tình huống này, tốt hơn là để tập lệnh “theo dõi” các thay đổi đối với mã của bạn và sau đó tự động chạy tập lệnh xây dựng

Chúng ta có thể đạt được điều này bằng cách sử dụng lệnh gói

sass assets/scss/style.scss dist/css/style.csss
79. Lệnh
sass assets/scss/style.scss dist/css/style.csss
79 hoạt động bằng cách xem các tệp bạn chỉ định bằng cách sử dụng mẫu hình cầu, sau đó chạy lệnh bạn chỉ định (sau
sass assets/scss/style.scss dist/css/style.csss
51). Ví dụ: để xây dựng tệp CSS của chúng tôi khi tệp Sass của chúng tôi thay đổi

sass assets/scss/style.scss dist/css/style.csss
7

Vì vậy, chúng tôi có thể tạo một số tập lệnh

sass assets/scss/style.scss dist/css/style.csss
52 mới và thêm chúng vào
sass assets/scss/style.scss dist/css/style.csss
4

sass assets/scss/style.scss dist/css/style.csss
0

Bây giờ nếu chúng tôi chạy

sass assets/scss/style.scss dist/css/style.csss
54, nó sẽ theo dõi các thay đổi đối với các tệp Sass của chúng tôi và chạy
sass assets/scss/style.scss dist/css/style.csss
55 nếu phát hiện bất kỳ thay đổi nào (và tương tự đối với JS)

Chạy tập lệnh song song

Giả sử bạn muốn chạy cả hai tập lệnh

sass assets/scss/style.scss dist/css/style.csss
52 cùng lúc khi bạn đang làm việc trên các tệp CSS và JS của mình. Việc chạy
sass assets/scss/style.scss dist/css/style.csss
57 sẽ không hoạt động vì các lệnh này được chạy theo trình tự (tôi. e. ,
sass assets/scss/style.scss dist/css/style.csss
58 sẽ không chạy cho đến khi
sass assets/scss/style.scss dist/css/style.csss
59 kết thúc). Làm cách nào để chúng tôi chạy song song các tập lệnh này?

sass assets/scss/style.scss dist/css/style.csss
70 có cờ
sass assets/scss/style.scss dist/css/style.csss
72 cho phép chúng tôi chạy các nhóm tác vụ cùng một lúc. Vì vậy, hãy tạo một tập lệnh
sass assets/scss/style.scss dist/css/style.csss
52 mới

sass assets/scss/style.scss dist/css/style.csss
0

Lệnh này sẽ chạy song song bất kỳ tập lệnh

sass assets/scss/style.scss dist/css/style.csss
74 nào mà chúng tôi đã xác định, vì vậy chúng tôi có thể làm việc trên cả tệp CSS và tệp JS của mình và yêu cầu chúng được xây dựng lại cùng một lúc. Thành công. Các tập lệnh npm cuối cùng của chúng tôi bây giờ là

sass assets/scss/style.scss dist/css/style.csss
1

Sử dụng tập lệnh của bạn để triển khai

Ưu điểm khác của việc sử dụng tập lệnh npm theo cách này là có thể sử dụng lại tập lệnh

sass assets/scss/style.scss dist/css/style.csss
73 để triển khai nội dung của bạn tới máy chủ

Ví dụ: giả sử bạn sử dụng tập lệnh npm để tạo nội dung giao diện người dùng cho trang web hoặc ứng dụng mà bạn quản lý thông qua GitHub và lưu trữ bằng SpinupWP. Sử dụng hỗ trợ Git của SpinupWP, bạn sẽ định cấu hình trang web để tự động lấy mã từ kho lưu trữ GitHub. Tuy nhiên, nội dung sẽ không được tạo cho đến khi bạn SSH vào máy chủ và chạy thủ công

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
9 và
sass assets/scss/style.scss dist/css/style.csss
78

May mắn thay, bạn có thể thêm các lệnh này vào Tập lệnh triển khai khi định cấu hình kho lưu trữ Git trong SpinupWP

Npm chạy xây dựng NodeJS

Trong ví dụ trên, tôi đã tạo một trang mẫu nhỏ được triển khai từ kho lưu trữ Git. Kho lưu trữ có cùng tệp nội dung và tập lệnh npm như dự án mẫu của chúng tôi. Phần bổ sung duy nhất là một tệp

sass assets/scss/style.scss dist/css/style.csss
78, hiển thị một số dữ liệu demo bằng cách sử dụng CSS, JavaScript và hình ảnh được tạo bởi các tập lệnh npm của chúng tôi

Tại ô Deploy Script trong SpinupWP mình thêm 2 lệnh sau

sass assets/scss/style.scss dist/css/style.csss
2

Bây giờ, mỗi khi tôi đẩy mã mới, SpinupWP sẽ chạy các lệnh tập lệnh triển khai sau khi tìm nạp các thay đổi Git, cài đặt bất kỳ gói npm mới nào mà tôi có thể đã thêm và xây dựng lại tất cả nội dung giao diện người dùng của tôi. 🙂

bản án

Bây giờ bạn sẽ có một ý tưởng tốt về việc tạo một công cụ xây dựng chỉ sử dụng các tập lệnh npm và các gói CLI trông như thế nào. Vậy bạn có nên sử dụng tập lệnh npm thay vì công cụ xây dựng như Grunt hoặc Gulp không?

Tôi có xu hướng nghĩ rằng các tập lệnh npm có vẻ như là một giải pháp gọn gàng hơn là phải cài đặt và tìm hiểu các khái niệm trừu tượng của các công cụ xây dựng như Grunt và Gulp, đặc biệt là đối với các dự án nhỏ hơn. Tuy nhiên, tôi có thể tưởng tượng tệp

sass assets/scss/style.scss dist/css/style.csss
4 của bạn trở nên khá lộn xộn và phức tạp đối với các dự án lớn hơn với vô số tập lệnh. Tại thời điểm đó, có một tệp cấu hình riêng, dành riêng cho bản dựng của bạn có thể có ý nghĩa hơn

Ngoài ra, hiệu suất dường như kém hơn nhiều so với cả Grunt và Gulp. Các tập lệnh Npm không có lợi thế là có thể sử dụng các luồng nút theo cách của Gulp, nhưng ngay cả Grunt cũng chạy nhanh hơn đáng kể so với các tập lệnh npm. Do thay thế

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
2 bằng
"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
1, thật khó để so sánh điểm chuẩn trực tiếp với , nhưng ngay cả khi chúng tôi bỏ qua phần xử lý hình ảnh, các tập lệnh npm vẫn chậm

  • Tiếng càu nhàu. 1. 6 giây
  • Nuốt chửng. 0. 84 giây
  • Tập lệnh Npm (không xử lý ảnh). 2. 0 giây
  • Tập lệnh Npm (có xử lý hình ảnh). 6. 0 giây

Điều này mang đến một điểm khác. tính khả dụng của plugin. Để thực hiện đúng điểm chuẩn, tôi đã cố gắng tìm các plugin Grunt và Gulp cho

"scripts": {
    "scss": "sass assets/scss/style.scss dist/css/style.css"
}
1. Trong khi có một cái cho Gulp, một cái không tồn tại cho Grunt. Wikimedia gần đây đã phát hiện ra điều này và chuyển sang sử dụng tập lệnh npm

Điều đó đang được nói, một điều cần nhớ là việc sử dụng tập lệnh npm hoặc Grunt/Gulp không loại trừ lẫn nhau. Bạn luôn có thể chạy Grunt/Gulp bên trong tập lệnh npm như một phần của quy trình xây dựng của mình. Điều này có thể giúp giải quyết các vấn đề về hiệu suất nhưng cũng sẽ hữu ích nếu bạn đang cố gắng di chuyển nhóm của mình từ tập lệnh Grunt/Gulp sang npm và muốn thực hiện một cách tiếp cận so le hơn trước khi thay thế hoàn toàn Grunt/Gulp. Nhóm phát triển của chúng tôi đang sử dụng các tập lệnh npm để gọi các tác vụ Gulp cho bản phát hành chính tiếp theo được lên kế hoạch của WP Offload Media. Điều này là do các tác vụ Gulp tương đối phức tạp và sẽ khó triển khai chức năng tương tự bằng cách sử dụng các tập lệnh npm thông thường

Bạn có nghĩ rằng sử dụng tập lệnh npm là một giải pháp thay thế tốt hơn cho các công cụ xây dựng khác như Grunt hoặc Gulp không?

Mục nhập này đã được đăng trong WP Offload Media, Workflow và được gắn thẻ Grunt, Gulp, Build Tools, Npm

Giới thiệu về tác giả

Jonathan Bossenger

Jonathan là một người đam mê mã nguồn mở, nhà phát triển và nhà văn đến từ Cape Town, Nam Phi. Anh ấy thích tìm hiểu về các công nghệ web mới và chia sẻ kiến ​​thức đó với người khác. Dễ bị uống quá nhiều cà phê

@jon_bossenger jonathanbossenger. com

  • nic1 nói.

    Cám ơn vì cái này. Tôi thấy mình có những lúc dường như đang lãng phí nhiều thời gian hơn mức cần thiết, càu nhàu. Tôi sẽ thử dự án tiếp theo

  • Phi Phan nói.

    Tôi đã sử dụng npm làm công cụ xây dựng cho một số dự án gần đây của mình. Tôi đề xuất một số gói khác như scss-lint cho linting sass, postcss cho autoprefix, eslint cho linting js, babel cho es2015. Tôi cũng sử dụng gật đầu thay vì onchange để xem tệp

  • Jonny Kates nói.

    Tôi đã cân nhắc chuyển sang sử dụng tập lệnh npm làm công cụ xây dựng trong một thời gian, nhưng hiệu suất đạt được mà bạn đề cập ở cuối là điều ngăn cản tôi áp dụng nó trên Gulp. Ví dụ: nếu tôi đang xem tất cả các phần Sass của mình, thì thời gian để biên dịch thực sự là ưu tiên hàng đầu của tôi

  • Lewis Warren nói.

    Cảm ơn vì điều này. Công cụ siêu tốt

  • Kevin Bauman nói.

    Tôi đã sử dụng độc quyền các tập lệnh NPM trong vài năm nay. Tôi thích nó hơn Grunt và Gulp. Tôi vẫn đang sử dụng gần như cùng một bộ tập lệnh để phát triển WordPress mà tôi đã tạo ra vào năm 2018 hoặc lâu hơn. Đây là thiết lập tôi đã có vào năm 2018. https. //www. studio4130. com/wordpress-Development-using-npm-scripts/ Hôm nay nó gần như giống nhau, mặc dù tôi có lẽ nên cập nhật nó một chút

  • ChunTing Liu nói.

    Đối với tôi, các tập lệnh NPM có thể là tập hợp các lệnh cần thiết để nhà phát triển nhanh chóng bắt đầu/xây dựng thứ gì đó tại thời điểm mã được kiểm tra từ repo. Nó có thể là một trình chạy nhiệm vụ xây dựng tốt ở giai đoạn đầu của/dự án đơn giản, nhưng khi quá trình xây dựng trở nên hơi lộn xộn, Grunt/Gulp có thể được xem xét. Nhưng giống như bạn đã nói, các tập lệnh NPM và trình chạy tác vụ khác không nên loại trừ lẫn nhau, vì vậy tôi cho rằng mình vẫn giữ các lệnh thiết yếu cần thiết cho hoạt động hàng ngày của nhà phát triển/QA trong các tập lệnh NPM, trong khi ủy thác tất cả các logic xây dựng phức tạp cho Grunt/Gulp. Tôi không biết chi tiết về điểm chuẩn, nhưng nếu đó chỉ là một vài giây khác biệt đối với công việc xây dựng, tôi sẽ không ngại gọi

    sass assets/scss/style.scss dist/css/style.csss
    
    73 trong Grunt/Gulp nếu đã có sẵn một số tập lệnh NPM hữu ích phục vụ cùng một mục đích — một . )

    npm run build trong nút JS là gì?

    npm build là một lệnh nội bộ và được gọi bằng các lệnh liên kết và cài đặt , theo tài liệu về build. Đây là lệnh hệ thống ống nước được gọi bởi liên kết npm và cài đặt npm. Bạn sẽ không gọi npm build bình thường vì nó được sử dụng nội bộ để xây dựng các addon Node C/C++ gốc bằng cách sử dụng node-gyp.

    Làm cách nào để chạy lệnh xây dựng npm?

    Tất cả các lệnh xây dựng được thực thi thông qua NPM Scripts. .
    npm chạy dev. Bắt đầu một nút. máy chủ phát triển cục bộ js. .
    npm chạy xây dựng. Xây dựng tài sản cho sản xuất. .
    đơn vị chạy npm. Chạy thử nghiệm đơn vị trong JSDOM với Jest. .
    npm chạy e2e. Chạy thử nghiệm từ đầu đến cuối với Nightwatch. .
    npm chạy lint. Chạy eslint và báo cáo bất kỳ lỗi linting nào trong mã của bạn

    Làm cách nào để chạy npm trong nút js?

    Cách cài đặt nút. .
    Bước 1. Tải xuống nút. trình cài đặt js. Trong trình duyệt web, điều hướng đến https. //nodejs. org/vi/tải xuống/. .
    Bước 2. Cài đặt nút. js và NPM từ Trình duyệt. .
    Bước 3. xác minh cài đặt. Mở dấu nhắc lệnh (hoặc PowerShell) và nhập thông tin sau. nút -v

    Làm cách nào để xây dựng ứng dụng nút js bằng npm?

    Truy cập trang web (địa phương) của bạn. .
    Bước 1. Truy cập trang web NodeJS và tải xuống NodeJS. .
    Bước 2. Đảm bảo rằng Node và NPM đã được cài đặt và PATH của chúng được xác định. .
    Bước 3. Tạo một thư mục dự án mới. .
    Bước 4. Bắt đầu chạy NPM trong thư mục dự án của bạn. .
    Bước 5. Cài đặt bất kỳ gói NPM nào. .
    Bước 6. Tạo một tệp HTML