Cách cài đặt grunt và cách xây dựng tập lệnh với nó

Question 1

Xin chào, tôi đang cố gắng cài đặt Grunt trên Windows 7 64 bit. Tôi đã cài đặt Grunt bằng lệnh

 npm install -g grunt
 npm install -g grunt-cli

nhưng bây giờ nếu tôi cố gắng làm điều đó grunt init, nó đang mang lại cho tôi một lỗi -

Không thể tìm thấy Gruntfile hợp lệ. Vui lòng xem hướng dẫn bắt đầu để biết thêm thông tin về cách định cấu hình grunt: http://gruntjs.com/getting-started Lỗi nghiêm trọng: Không thể tìm thấy Gruntfile.

Nhưng khi tôi nhìn vào bên trong thư mục grunt trên hệ thống của mình, Gruntfile.jsnó vẫn ở đó. ai đó có thể vui lòng hướng dẫn tôi cách cài đặt grunt này đúng cách và cách viết Script đã xây dựng bằng grunt không. Tôi có một trang HTML và tập lệnh java nếu tôi muốn xây dựng một tập lệnh bằng Grunt, làm thế nào tôi có thể làm điều đó?

Question 2

Để thiết lập bản dựng GruntJS, đây là các bước:

Đảm bảo bạn đã thiết lập package.jsonhoặc thiết lập mới:
```
npm init
```
Cài đặt Grunt CLI dưới dạng toàn cầu:
```
npm install -g grunt-cli
```
Cài đặt Grunt trong dự án cục bộ của bạn:
```
npm install grunt --save-dev
```
Cài đặt bất kỳ Mô-đun Grunt nào bạn có thể cần trong quá trình xây dựng của mình. Chỉ vì mục đích của mẫu này, tôi sẽ thêm mô-đun Concat để kết hợp các tệp với nhau:
```
npm install grunt-contrib-concat --save-dev
```

Bây giờ bạn cần thiết lập của bạn Gruntfile.jssẽ mô tả quá trình xây dựng của bạn. Đối với mẫu này, tôi chỉ cần kết hợp hai tệp JS file1.jsvà file2.jstrong jsthư mục và tạo app.js:

module.exports = function(grunt) {

    // Project configuration.
    grunt.initConfig({
        concat: {
            "options": { "separator": ";" },
            "build": {
                "src": ["js/file1.js", "js/file2.js"],
                "dest": "js/app.js"
            }
        }
    });

    // Load required modules
    grunt.loadNpmTasks('grunt-contrib-concat');

    // Task definitions
    grunt.registerTask('default', ['concat']);
};

Bây giờ bạn sẽ sẵn sàng chạy quy trình xây dựng của mình bằng lệnh sau:
```
grunt
```

Tôi hy vọng điều này cung cấp cho bạn ý tưởng về cách làm việc với bản dựng GruntJS.

GHI CHÚ:

Bạn có thể sử dụng grunt-initđể tạo Gruntfile.jsnếu bạn muốn tạo dựa trên trình hướng dẫn thay vì viết mã thô cho bước 5.

Để làm như vậy, vui lòng làm theo các bước sau:

npm install -g grunt-init
git clone https://github.com/gruntjs/grunt-init-gruntfile.git ~/.grunt-init/gruntfile
grunt-init gruntfile

Đối với người dùng Windows: Nếu bạn đang sử dụng cmd.exe, bạn cần thay đổi ~/.grunt-init/gruntfilethành %USERPROFILE%\.grunt-init\. PowerShell sẽ nhận dạng ~chính xác.

Question 3

Đôi khi chúng ta cần đặt biến PATH cho WINDOWS

% USERPROFILE% \ AppData \ Roaming \ npm

Sau bài kiểm tra đó với where grunt

Lưu ý: Đừng quên đóng cửa sổ nhắc lệnh và mở lại.

Question 4

Tôi gặp vấn đề tương tự, nhưng tôi đã giải quyết nó bằng cách thay đổi Grunt.js của mình thành Gruntfile.js Kiểm tra tên tệp của bạn trước khi nhập grunt.cmd trên Windows cmd (nếu bạn đang sử dụng Windows).

Question 5

Bạn nên cài đặt grunt-cli vào devDependencies của dự án và sau đó chạy nó qua một tập lệnh trong package.json của bạn. Bằng cách này, các nhà phát triển khác làm việc trên dự án sẽ sử dụng cùng một phiên bản grunt và không phải cài đặt toàn cầu như một phần của thiết lập.

Cài đặt grunt-cli với npm i -D grunt-clithay vì cài đặt nó trên toàn cầu với -g.

//package.json

...

"scripts": {
  "build": "grunt"
}

Sau đó, sử dụng npm run buildđể chữa cháy.