2012-02-24 64 views
17

Tôi hiện đang sử dụng plugin Aptana cho Eclipse, cho phép tôi nhấn mạnh cú pháp tuyệt vời và cho phép tôi bấm vào tệp * .scss thành tệp * .css theo cách thủ công. Những gì tôi thực sự muốn có thể làm là làm cho nó tự động biên dịch mỗi khi tôi tiết kiệm, nhưng tôi không thể tìm ra cách để làm điều này.Plugin Eclipse để tự động biên dịch các tệp Sass

Tôi biết bạn có thể sử dụng sass - watch trên dòng lệnh, nhưng tôi không muốn phải thiết lập thủ công mỗi lần tôi mở nhật thực hoặc tạo dự án mới.

Có ai đã tìm thấy cách hay để đạt được điều này không? Có phải là một cách để hooking vào gói Sass của Aptana và chạy lệnh biên dịch của nó mỗi khi tôi lưu? Câu trả lời được chấp nhận cho this question đề xuất sử dụng "Trình tạo chương trình" - nhưng đây thực sự là giải pháp tốt nhất? Nếu có thì có ai có lời khuyên/liên kết đến hướng dẫn không?

Cập nhật: Tôi đã viết a blog post về cách sử dụng tập lệnh kiến ​​làm người xây dựng, nhưng tôi vẫn đang tìm kiếm một cách tốt hơn.

+2

Trang này có thể trợ giúp không? [link] (http://wirelesswombat.com/2012/06/17/automatically-compling-sass-compass-in-eclipse-zend-studio/) [1]: http: // wirelesswombat.com/2012/06/17/tự động-compling-sass-la-bàn-eclipse-zend-studio/ – seron

+0

@ seron: Bạn nên làm cho câu trả lời ... – mliebelt

+0

Tôi đã làm theo lời khuyên của bạn. – seron

Trả lời

2

có khóa chuyển đổi watch cho bộ điều khiển sass.
tạo lại tệp đầu ra (css) mọi lúc thay đổi nguồn (scss, sass).

Trích dẫn từ: http://sass-lang.com/documentation/file.SASS_REFERENCE.html#using_sass

Sử dụng Sass

Sass có thể được sử dụng trong ba cách: như một công cụ dòng lệnh, như một module của Ruby độc lập, và như là một plugin cho bất kỳ Rack- bật khung công tác , bao gồm Ruby on Rails và Merb. Bước đầu tiên cho tất cả các đây là để cài đặt đá quý Sass:

gem install sass Nếu bạn đang sử dụng Windows, trước tiên bạn cần phải cài đặt Ruby .

Để chạy Sass từ dòng lệnh, chỉ cần sử dụng

sass input.scss output.css Bạn cũng có thể cho Sass để xem các tập tin và cập nhật CSS mỗi khi Sass nộp thay đổi:

sass --watch input.scss: output.css Nếu bạn có một thư mục với nhiều tập tin Sass,
bạn cũng có thể nói với Sass để xem toàn bộ thư mục:

sass --watch app/sass: publ ic/stylesheets Sử dụng sass --help cho tài liệu đầy đủ .

Sử dụng Sass trong mã Ruby rất đơn giản. Sau khi cài đặt đá quý Sass, bạn có thể sử dụng nó bằng cách chạy yêu cầu "sass" và sử dụng Sass :: Engine như như vậy:

engine = Sass :: Engine.new ("# main {background-color: # 0000ff } ",: cú pháp =>: scss).hiển thị # => "#main {background-color: # 0000ff;} \ n"

12

Sau nhiều lần thử, tôi đã tìm ra giải pháp tốt nhất trong Eclipse là xác định Trình tạo đơn giản bằng cách sử dụng - cập nhật tính năng sass:

  • Từ trình đơn Dự án, chọn "Thuộc tính" và chọn phần "Nhà xây dựng".
  • Tạo Trình tạo mới và chọn "Chương trình" làm loại cấu hình.
  • Chọn tên cho cấu hình khởi chạy của bạn (SASS ?!).
  • Chèn đường dẫn cài đặt sass của bạn vào trường Vị trí.
  • Sử dụng $ {project_loc} làm thư mục làm việc.
  • Trong hộp văn bản Đối số chèn tham số cấu hình bạn muốn sử dụng và cuối cùng, chỉ định tham số --update, sau đó là thư mục tệp sass của bạn theo sau ":" và thư mục đích cho tệp css đã biên dịch . Trong cấu hình "tài nguyên" của tôi là thư mục nguồn chứa các tệp .scss và "web" là thư mục đích chứa các tệp .css đã biên dịch. Lệnh --update sẽ kiểm tra các sửa đổi trong thư mục nguồn và tất cả các thư mục con. Screenshot
  • Trong tab "Tùy chọn xây dựng", chỉ cần kiểm tra tất cả các tùy chọn trong phần "Chạy trình tạo:". Bạn cũng có thể "Chỉ định tập hợp các tài nguyên có liên quan" để khởi chạy trình tạo chỉ khi các tệp có trong các thư mục đã chọn được lưu. Screenshot
  • Nhấp ok để lưu cấu hình khởi chạy của bạn.
  • Bây giờ hãy thử sửa đổi tệp .scss trong thư mục nguồn của bạn và sau đó lưu nó, bạn sẽ thấy đầu ra CLI sass trong cửa sổ bảng điều khiển của mình.

Sass CLI sẽ tự động kiểm tra tài nguyên đã sửa đổi bên trong thư mục nguồn (tài nguyên trong cấu hình của tôi) và biên dịch chúng vào thư mục đích (web trong cấu hình của tôi). Ngoài ra, tất cả các tệp .sass mà @import tài nguyên đã sửa đổi sẽ được biên dịch.

+1

Điều này có vẻ như là một giải pháp rất hợp lý đối với tôi. –

+1

Điều này hoạt động thực sự tốt. Tôi có tệp .scss và .css trong cùng một thư mục vì vậy tôi đã sử dụng "$ {project_loc}/src/main/webapp/css" cho thư mục làm việc của mình và được sử dụng "--update.:." trong các đối số. –

+0

Câu trả lời này thật tuyệt vời! Cảm ơn nhiều ! – Stilleur

1

Có giải pháp dễ dàng hơn nhiều. Chỉ cần làm theo các hướng dẫn để cài đặt Sass từ:

http://sass-lang.com/install

và bạn sẽ nhận thấy rằng trước hết bạn sẽ phải cài đặt Ruby. Sau đó, chỉ cần đi đến thư mục mà file SCSS/CSS của bạn đang nằm, bắt đầu CMD và chạy lệnh này DOS:

>cd <path-to-your-css-files> 
>sass --watch . 

Sau đó, tất cả các bạn cần làm là để liên kết các file SCSS của bạn để được công nhận bởi Eclipse như các tệp CSS gốc. Thực hiện theo giải pháp này:

https://stackoverflow.com/a/12322531/4180447

Hope this helps.

Lưu ý: Tôi có thể đã bỏ lỡ một hoặc hai bước. Điều này là theo những gì tôi nhớ sau khi tôi hoàn thành việc cài đặt. Nếu bạn gặp phải bất kỳ sự cố nào, chỉ cần đăng nhận xét và tôi sẽ cố gắng giúp bạn.

Tarek

Các vấn đề liên quan