5

Tôi đang tìm cách nâng cao trải nghiệm lập trình của mình và tôi tin rằng tôi có thể làm điều đó bằng cách tạo phần mở rộng Visual Studio (2012). Tôi đã bắt đầu đào sâu vào tài liệu trên MSDN, nhưng nó dày đặc và tôi đang làm việc thông qua nó.VS Phần mở rộng để thao tác HTML/CSS

tôi đã có một vài câu hỏi:

  1. là một phần mở rộng cách tiếp cận chính xác cho các kịch bản mô tả dưới đây?
  2. Nếu có, bất kỳ ý tưởng nào không gian tên tôi nên bắt đầu đào sâu vào?
  3. Bất kỳ sự khôn ngoan khôn ngoan/liên kết RE: "cạm bẫy" hoặc "gotcha"?

Setup Tôi có một khối HTML và nó có một số CSS nội tuyến trên một số yếu tố. Tôi muốn nhấp chuột phải vào phần tử và áp dụng mã nội tuyến cho một biểu định kiểu mới hoặc hiện có (CSS).

Bộ luật

<div> 
    <div class="ui-bar-d ui-bar" > 
     <span class="WBHeaderDetail" style="margin-left: 5px; margin-right: 5px;"> 
      Name: <em class="WBHeaderDetailValue" style="text-decoration: underline;">@ViewBag.JobName</em> 
     </span> 
     <span class="WBHeaderDetail" style="margin-left: 5px; margin-right: 5px;"> 
      Status: <em class="WBHeaderDetailValue" style="text-decoration: underline;">@ViewBag.Status</em> 
     </span> 
     <a data-role="button" data-theme="b" data-icon="check" data-inline="true" data-mini="true" >Save</a>  
    </div> 
</div> 

Có thể cho rằng, các hoạt động mở rộng đó sẽ phơi bày có thể lấy một tham chiếu đến một yếu tố nhất định và kiểm tra cho CSS nội tuyến (kiểu thẻ), loại bỏ nó khỏi các phần tử, và sau đó nối CSS đó vào biểu định kiểu mới hoặc hiện có trong dự án/giải pháp. Liệu phần tử đã có giá trị cho thuộc tính 'lớp' có thể tác động đến nhà cung cấp được chọn cho dự án này hay không.

CẬP NHẬT

Saw này trên: http://www.asp.net/vnext/overview/aspnet/whats-new

Nhiệm vụ thông minh

Trong chế độ Design view, tính chất phức tạp của các điều khiển máy chủ thường có liên quan đến các hộp thoại và trình thuật sĩ để làm cho nó dễ dàng để thiết lập chúng. Ví dụ, bạn có thể sử dụng một hộp thoại đặc biệt để thêm nguồn dữ liệu vào điều khiển lặp lại hoặc thêm cột vào điều khiển GridView.

Tuy nhiên, loại trợ giúp giao diện người dùng này cho các thuộc tính phức tạp chưa có sẵn trong chế độ xem Nguồn. Do đó, Visual Studio 11 giới thiệu Công việc thông minh cho chế độ xem Nguồn. Công việc thông minh là các lối tắt nhận biết ngữ cảnh cho các tính năng thường được sử dụng trong trình chỉnh sửa C# và Visual Basic.

Đối với ASP.NET Web Forms điều khiển, Nhiệm vụ thông minh xuất hiện trên thẻ máy chủ như một hình tượng nhỏ khi điểm chèn nằm trong phần tử:

enter image description here

Tôi có thể lấy mã của tôi vào hộp thoại?

CẢM ƠN!

+0

Bổ trợ/vsix: Có, đây là cách để thực hiện. Để được hướng dẫn, tôi thường quét codeplex cho một dự án làm những việc tương tự và sau đó duyệt các nguồn của nó;). – jessehouwing

+0

thông tin thêm. xem câu hỏi đã sửa đổi. –

+0

Tôi đã đọc cho bạn toàn bộ câu hỏi. nhưng vì tiếng Anh của tôi không tốt lắm. Tôi không hiểu tại sao bạn không làm tất cả điều này với công nghệ web. Tôi chắc rằng bạn biết về tất cả điều này. '('Jquery' là một trợ giúp rất tốt về phía khách hàng. 'JUI' một giao diện rất tốt. 'AJAX' một công nghệ rất tốt có thể thực hiện sử dụng mã phía máy chủ và giao dịch với máy chủ và ...)? ' và As bạn biết tất cả mọi thứ đang chuyển sang dạng ứng dụng web. mã nguồn mở luôn luôn và bất cứ nơi nào có thể truy cập và .... – ncm

Trả lời

3

Tôi đã thực hiện một phần mở rộng VS nhỏ vào năm ngoái cho lớp học hóa ra khá tốt. Nó phải làm với việc sắp xếp, định dạng và tổ chức lại các tệp mã C++. Đó là một chút khác biệt so với những gì bạn muốn làm, nhưng tôi có thể đề nghị bạn hãy xem CodeMaid. Nó có một số lượng đáng ngạc nhiên các tính năng, và vì nó là mã nguồn mở, mã nguồn thực sự đã giúp tôi khi tôi đang làm việc trên phần mở rộng của mình.

Thật không may, bạn đang làm việc với HTML và Visual Studio chỉ cung cấp mô hình mã (AST cơ bản) cho C# và một chút nhỏ của C++. Bạn sẽ không nhận được bất kỳ trợ giúp nào từ studio trực quan với chỉnh sửa HTML.

Vì vậy, tôi sẽ làm 2 việc. Trước tiên, hãy xem hướng dẫn these. Chúng sẽ giúp bạn tạo cơ sở cho tiện ích của bạn và làm quen với API. (Bạn có thể sẽ phải tìm kiếm những người khác để nâng cao kiến ​​thức của bạn, như hướng dẫn MS không phải là lớn nhất.) Thứ hai, đánh bóng trên các biểu thức thông thường của bạn. Cách tốt nhất để hoàn thành những gì bạn muốn có lẽ là phân tích cú pháp tệp của chính bạn và xác định tất cả các phiên bản của thẻ kiểu nội tuyến. Sau đó, thêm một mục trình đơn nhấp chuột phải và tìm thẻ phù hợp khi bạn cần.

Nhưng một lần nữa, tôi sẽ bắt đầu với các hướng dẫn cơ bản. API tiện ích mở rộng của VS hơi lạ, vì vậy, bạn có thể muốn làm quen với nó bằng cách thực hiện các công cụ đơn giản trước tiên.

Chúc may mắn, bạn sẽ cần đến nó. : p

EDIT: Tôi biết điều này không trực tiếp trả lời câu hỏi của bạn, chỉ cần cung cấp một chút lời khuyên.

3

Có VSIX là cách di chuyển.

Bạn có thể xem một số mã từ Web Essentials. Các yếu tố cần thiết trên web thực hiện điều gì đó tương tự với những gì bạn muốn làm.

Sau đây là một liên kết đến sorter CSS trên github: https://github.com/madskristensen/CssSorter

Và một đây là một liên kết đến các tính năng HTML ZenCoding: https://github.com/madskristensen/zencoding

Kể từ khi cả hai liên quan đến việc đối phó với HTML, CSS bạn có thể nhận được rất nhiều thông tin khi xem mã. Sự khác biệt duy nhất với dự án của bạn là bạn đang thực sự nhắm mục tiêu cả hai cùng một lúc và đang xem xét việc truy cập nhiều tệp. Không may mắn thay, đối với HTML và CSS, tôi không biết rằng có sẵn một trình phân tích cú pháp tích hợp sẵn.

Có một vài gói availble trên NuGet mặc dù, vì vậy bạn có thể thử những hiểu: ExCSS kiểu Parser: http://nuget.org/packages/ExCSS/ HtmlAgilityPack: http://nuget.org/packages/HtmlAgilityPack/

Tôi chưa từng làm việc với những gói trực tiếp, nhưng tôi đoán bạn' sẽ phải thử chúng và xem nó có phù hợp không.

Đối với smarttasks: đây thường là một phần của nhà thiết kế điều khiển và tôi không nghĩ nó phù hợp với những gì bạn muốn làm. Tôi sẽ chỉ thêm tiện ích mở rộng của bạn vào menu ngữ cảnh