Điều này bao gồm một số thông tin cơ bản về nút.
0. Sắp xếp mã. Đó là quy ước để đặt mã ứng dụng Node chính của bạn vào một tệp có tên là app.js
trong thư mục gốc của dự án.
Bên app.js điều được nhóm thành hai phần chung:
- đồng bộ khởi tạo: yêu cầu mô-đun, xây dựng thư mục, đọc configs, kết nối db, vv Những điều mà chặn, vì vậy họ phải tồn tại hoặc chết nhanh.
- không đồng bộ nhiệm vụ ứng dụng: máy chủ khởi động, quy trình nền, tự động biên dịch CSS & JS, định tuyến, i/o, v.v. Những thứ trong vòng lặp sự kiện.
1. Biên dịch Stylus thành CSS khi bạn tạo ứng dụng. Chúng tôi cần yêu cầu mô-đun stylus. Thông thường, điều này được thực hiện ở đầu app.js để giữ các phụ thuộc với nhau.
var stylus = require('stylus');
Lần đầu tiên Node chạy app.js
, bạn cần mô-đun JS này để xây dựng CSS của mình. Đây là ý tưởng cơ bản:
stylus.render(stylus-code-string, function(err, css) {
if (err) throw err;
console.log(css);
});
Đây là số Stylus Javascript API chính thức.
Để sử dụng sức mạnh của nút, bạn nên đọc tệp bút bằng cách sử dụng fs module vào bộ đệm, sau đó chuyển đổi thành chuỗi và cuối cùng chuyển nó vào stylus.render()
. Sau đó, gửi kết quả vào tệp đích. Vì đây là một phần của quá trình xây dựng nên nó có thể đồng bộ. Nhưng đây không phải là câu hỏi của bạn ...
2. Tự động biên dịch CSS bằng bút stylus làm quá trình nền.
Chức năng này spawns một child_process rằng đồng hồ một .styl
tập tin duy nhất và biên dịch bao gồm .styl
file thành một file .css
. Bạn không cần một mô-đun cho điều này, chỉ cài đặt bút thực thi để nó chạy trên dòng lệnh. (Bạn đã làm điều này). Ví dụ này được tạo bằng phiên bản bút stylus 0.5.0. Ngoài ra, đường dẫn thư mục mà bạn sử dụng (ví dụ: build/styles
và styles
) cần phải tồn tại.
function watchStyles(sourcefile, destinationfolder) {
var Stylus = child_process.spawn('stylus', ['--sourcemap', '-w', sourcefile, '--out', destinationfolder]);
Stylus.stdout.pipe(process.stdout); // notifications: watching, compiled, generated.
Stylus.stderr.pipe(process.stdout); // warnings: ParseError.
Stylus.on('error', function(err) {
console.log("Stylus process("+Stylus.pid+") error: "+err);
console.log(err);
});
// Report unclean exit.
Stylus.on('close', function (code) {
if (code !== 0) {
console.log("Stylus process("+Stylus.pid+") exited with code " + code);
}
});
}
Tiếp theo, bạn cần gọi hàm này đôi khi sau khi bạn khởi động ứng dụng. Vượt qua tệp chính của bạn .styl
làm nguồn. Sau đó, thư mục đích nơi bạn muốn CSS của bạn đi.
// check that you passed '-w' parameter
if (process.argv[2] && (process.argv[2] == "-w")) {
watchStyles('styles/app.styl', 'build/styles');
}
Khởi động ứng dụng bằng cách chạy: $ node app.js -w
Nó giúp tổ chức .styl
tập tin của bạn dưới một app.styl
để các nội dung của app.styl
của bạn trông như thế này:
@import 'layout'
@import 'header'
@import 'main'
@import 'footer'
@import 'modal'
@import 'overrides'
Ok, phần đó nói "Sau đó thêm dòng này vào cấu hình ứng dụng của bạn", cấu hình ứng dụng nào. Điều duy nhất tôi cần node.js là biên dịch tập tin bút stylus của tôi. Ứng dụng web thực sự của tôi không cần node.js và tôi không muốn bao gồm node.js cho ứng dụng web của mình. – ryanzec
Đã chỉnh sửa câu trả lời của tôi ... hy vọng điều này có ý nghĩa hơn ... – silverfighter