Cách xác thực các mẫu HTML góc cạnh

Question

Tôi cố gắng viết đa số hợp lệ (X) HTML 5 trong các mẫu HTML góc cạnh của mình. Họ trông giống như thế này:

<div class="some-class"> 
    <input type="checkbox" data-ng-model="variable" /> 
    <foo-directive data-ng-if="variable"></foo-directive> 
</div> 

Thỉnh thoảng tôi quên đóng thẻ đúng cách phá vỡ một số trình duyệt. Vì vậy, tôi muốn bao gồm một validator trong toolchain của tôi.

Vấn đề là: Tôi không biết người xác thực có thể xử lý trường hợp này. Trình xác nhận hợp lệ XML thường yêu cầu một DTD, trình xác nhận hợp lệ HTML sẽ khiếu nại về các chỉ thị góc được sử dụng trong mã.

Có thể trình xác thực là từ sai và tôi thực sự muốn một linter. Điều thực sự duy nhất tôi muốn làm là kiểm tra xem mỗi thẻ mở có một thẻ đóng phù hợp hay không. Mọi thứ khác là tiền thưởng.

Bạn có biết trình xác thực như vậy không?

LƯU Ý: Tôi chủ yếu tìm kiếm công cụ dòng lệnh mà tôi có thể tích hợp với thử nghiệm tự động của mình. Nhưng một dịch vụ web cũng có thể hữu ích.

Answer 1

Kể từ htmlhint là một lựa chọn, bạn có thể sử dụng nó như mô tả here từ dòng lệnh (tất nhiên bạn sẽ phải npm install nó đầu tiên và chắc chắn rằng bạn PATH chứa node_modules/.bin):

htmlhint test.html 

Để kiểm tra cho cụ thể lựa chọn:

htmlhint -r tag-pair,attr-no-duplication test.html 

Hoặc nếu các tùy chọn đang ở trong một tập tin cấu hình:

htmlhint -c config-file test.html 

tôi sử dụng các tùy chọn sau đây với góc:

• tag-pair: đảm bảo thẻ được đóng đúng
• attr-no-duplication: không trùng lặp thuộc tính trong một yếu tố

Answer 2

Dự án html-angular-validate là những gì tôi sử dụng và tôi nghĩ nó hoàn hảo cho việc này. Nó sử dụng các dịch vụ xác nhận W3C HTML, và về cơ bản chỉ cần bỏ qua lỗi về biết thứ góc (như tính chất bắt đầu với ng-* mà thường không hợp lệ HTML)

tôi chạy nó thông qua ngụm sử dụng gulp-html-angular-validate

Bạn sẽ phải cấu hình nó để biết về các chỉ thị thuộc tính và phần tử tùy chỉnh của bạn, có thể trở thành một phần của ain nếu bạn luôn thêm những cái mới ... hoever khi bạn đã thực hiện nó hoạt động khá tốt và đã lưu nhóm của tôi nhiều lần bằng cách tìm lỗi chính tả đơn giản và lỗi phổ biến!