LESS-エディターとプラグイン

この章では、LESSでのエディタープラグインの重要性を理解します。エディタは、ユーザーがテキストを編集できるようにするシステムまたはプログラムです。プラグインは、サイトの機能を拡張するために使用されるソフトウェアです。

ここで、LESSのエディターとIDEについて説明します。

シニア番号 エディターとIDEと説明
1 噛み砕く!

Windows、MacLinuxなどのクロスプラットフォームをサポートしています。エディターに統合コンパイルを提供します。

2 Mindscape Web Workbench

CoffeeScript、SASS、Compass、LESSの編集を提供し、VisualStudioでの最新のWeb開発を容易にします。

3 NetBeans

これはオープンソースのJavaベースのIDEです。これは、デスクトップ、モバイル、Webアプリケーション、およびHTML、JavaScript、CSSを含むHTML5アプリケーションの迅速な開発に役立ちます。

4 TextMate

これは、Mac OS X用の汎用グラフィカルテキストエディタです。宣言的なカスタマイズ、記録可能なマクロ、スニペット、シェル統合、開いているドキュメントタブ、および拡張可能なバンドルシステムを備えています。

5 Vim

vimバンドルは、動的スタイルシート言語LESSのインデント、強調表示、オートコンプリートなどの機能を追加します。

6 Emacs

これには、LESS CSS(lesscss.org)のEmacsモードを提供するless-css-modelが含まれています。Emacsはコンパイルオンセーブをサポートしています。

7 jetBrainsWebStormおよびPhpStorm

WebStromは軽量で強力なIDEです。Node.jsを使用した複雑なクライアント側およびサーバー開発に完全に対応しています。PhpStormはPHPIDEであり、コードの深い理解をサポートし、一流のコーディング支援とすべての主要なツールおよびフレームワークのサポートを提供します。

8 ブラケット

これは、Webデザイナーやフロントエンド開発者を支援する、軽量で強力なオープンソースのコードエディターです。

9 CodeLobster

これは、主にPHP用のポータブル統合開発環境(IDE)です。また、HTML、CSS、JavaScriptの開発もサポートしており、Drupal、WordPress、Smarty、Joomla、JQuery、Facebook、Codeigniter、Yii、CakePHPのプラグインを利用できます。

10 KineticWing IDE

迅速、クリーン、軽量、ポータブルなIDEです。これは、スマートかつ高速に作業するのに役立つフルサ​​イズの開発スイートです。

11 nodeMirror

これはオープンソースで簡単にカスタマイズできるIDEです。CodeMirror.net、pty.jsおよびその他のライブラリを利用します。

12 HTMLキットツール

これは、HTML5、CSS3、JavaScriptなどの最新のWebエディターです。これにより、最新の標準に準拠したエディターからプロジェクトを編集、プレビュー、検証、公開、および管理できます。

崇高なテキスト2&3

崇高なテキストは、次の表に示すようLESSのためのさまざまなオプションを提供します-

シニア番号 オプションと説明
1 あまり崇高ではない

崇高なテキストのLESS構文は、スニペットとともに.lessファイルの構文の強調表示を提供します。

2 Sublime-Less-to-CSS

保存時に.lessファイルをCSSにコンパイルするための崇高なテキスト2および3プラグイン。必要ですlessc PATHにインストールされています。

3 ビルドが少ない-崇高

用LESSビルドシステム崇高なテキスト2 LESSファイル用の2つのビルドシステムを提供し、両方が縮小さと非縮小さ。

4

SublimeOnSaveBuild

これは、[保存]をクリックしたときにビルドをトリガーする崇高なテキスト2のシンプルなプラグインです。LESS、Compassなどのプリプロセッサでうまく機能します。

Eclipse

Eclipseには、次の表に示すように、LESS用の2つのプラグインがあります-

シニア番号 プラグインと説明
1 EclipseLessプラグイン

このプラグインは、Eclipse IDEを拡張することにより、LESSスタイルシートを編集およびコンパイルするための便利な機能を提供します。

2 Transpilerプラグイン

このEclipseプラグインは、LESS、SASS、CoffeeScriptなどのファイルを自動的に変換します。

Visual Studio

Visual Studioには、LESSの次の異なるオプションがあります-

シニア番号 オプションと説明
1 CSSが少ない

この拡張機能により、LESSファイルがCSS言語サービスで開かれます。

2 Web Essentials 2012

この拡張機能を使用すると、一般的なタスクをはるかに簡単に実行でき、Web開発者向けの便利な機能がVisualStudioに追加されます。

3 Web Essentials 2013

Visual Studioを拡張して、特定の言語やエディターに固有ではない多くの新機能を追加します。

4 Webツール2013

これは、ASP.NETを含む開発タスクで役立ちます

ドリームウィーバー

Dreamweaverを使用する際は、次の点を考慮する必要があります。

  • これは、Webデザイナーや開発者がアプリケーションやWebサイトを作成するために使用するAdobeアプリケーションです。

  • ブラウザ、デバイス、タブレットなど、複数のプラットフォームで動作します。
  • Webデザイナーは、Dreamweaverを使用してWebサイトのプロトタイプを作成します。

  • DMXzone Less CSSコンパイラは、すべてのLESSCSSパワーをDreamweaverで直接作成します。

Notepad ++ 6.x

Notepad ++で作業するときは、次の点を考慮する必要があります。

  • Notepad ++は、タブ付き編集、つまり1つのウィンドウで複数の開いているファイルの操作をサポートするフリーテキストエディターおよびソースコードエディターです。

  • LESS for Notepad ++は、.lessファイルの構文の強調表示または色付けを提供するxmlファイルです。詳細については、このリンクをクリックしてください。

  • Notepad ++をインストールするには、このリンクをクリックしてください。