SASS.jsはありますか？LESS.jsのようなもの？

112

以前にLESS.jsを使用したことがあります。使いやすいです。

<link rel="stylesheet/less" href="main.less" type="text/css">
<script src="less.js" type="text/javascript"></script>

SASS.jsを見ました。どうすれば同じように使用できますか？SASSファイルを解析して、HTMLですぐに使用できます。SASS.jsはNode.jsで使用するためのもののようですか？

var sass = require('sass')
sass.render('... string of sass ...')
// => '... string of css ...'

sass.collect('... string of sass ...')
// => { selectors: [...], variables: { ... }, mixins: { ... }}
css  sass  less 
— ジウ・メン
ソース
6
生産に関しては悪の根であり、開発に関してはあなたが持っていsass watchます。
— Hauleth
3
「sass watch」の問題は、「sass watch」が実行される前にページを誤ってテストすることがあるということです。less.jsを使用してページをロードし、ページが表示されたときにCSSがコンパイルされていることを確認します。もちろん、開発環境でのみ。
— Maya Kathrine Andersen 2013
SassMeisterをチェックしてください：sassmeister.com-無料のオンラインSASSコンパイラ
— Dan
1
確かに、sass.js
— LukyVj
@Hauleth sassウォッチ（より少ないウォッチのように）は、オプションではない場合があります。特に、ソースファイルがサードパーティのビルド/依存関係によって処理され、Webアプリをパックまたはデプロイしてそのデプロイが遅い場合にのみ、完全なソースファイルを取得できます。（例：Java Webアプリ）
— Zardoz89

回答:

42

公式に認可されたsassまたはscssのJavaScript実装はありません。私が見た進行中の実装がいくつかありますが、現時点で使用することをお勧めできるものはありません。

ただし、いくつかの点に注意してください。

  1. すべてのユーザーに対して一度だけ実行できるのに、すべてのユーザーにスタイルシートをコンパイルさせる必要があるのはなぜですか。
  2. JavaScriptが無効になっている場合、サイトはどのように見えますか。
  3. 将来サーバー側の実装に変更する場合は、それに応じてすべてのテンプレートを変更する必要があります。

そのため、始めるにはもう少し設定が必要ですが、私たち（sassコアチーム）は、サーバー側のコンパイルが長期的なアプローチとして最良であると考えています。同様に、開発者が少ないほど、プロダクションスタイルシートのサーバー側コンパイルを好みます。

— クリセップシュタイン
ソース
157
私の使用例：Railsプロジェクトに配置されるhtml + cssテンプレートを開発しています。ローカルホスト開発の目的でsass.jsを用意しておくと、サーバーのことをいじる必要がなくなります。
— Josef Richter、
93
クライアント側のコンパイルが役立つケースはたくさんあります。たとえば、ユーザーに自分のページの外観を試してもらい、結果のみを保存したい場合は、サーバーに戻します。
— モントリオールマイク2011年
26
私は100％chriseppsteinに100％同意します（なぜユーザーにスタイルシートをコンパイルしてほしいのか）。ここでは説明しませんが、単純明快な開発です。私のcssと同様に、デプロイされたすべてのjsコードを縮小して圧縮します。しかし、開発中は、「コンパイルされた」バージョンではなくコードにアクセスできるようになります。すべてのフロントエンドエンジニアに代わって話すかどうかはわかりませんが、開発段階で必要な唯一のツールとして、私たちの多くがブラウザとエディタを使用していると言えます。開発中にsass / scssを「コンパイル」する必要はありません。展開/ CI /本番は別の問題
— Graza
15
著者側に何かを投げ込むこと。SASSの使用を検討したいのですが、Rubyを使用したり使用したりしません。したがって、クライアント側のソリューションはどれよりも望ましいです。Rubyで作成すると、その使用はRubyユーザーのみに制限されます。JSで記述されている場合は、クライアントまたはサーバー（ノード、クラシックasp、asp.net、およびその他）で使用できた可能性があります。
— ダン・
27
JavaScript実装は、Rubyに依存する必要なく、node / rhinoなどでサーバー側で使用することもできます
— Sam Hasler
29

visionmeda / sass.jsはもう利用できず、scss-jsは2年間更新されていないため、sass.jsに興味があるかもしれません。Emscriptenを使用してJavaScriptにコンパイルされたC ++ライブラリlibsass（node-sassでも使用）です。HTMLでリンクまたはインライン化されたscssスタイルシートをコンパイルするための実装は、sass.link.jsにあります。

インタラクティブなプレイグラウンドを使用してsass.jsを試してください

— Rodneyrehm
ソース
3
これで、C ++からRubyへのコンパイラが必要になり、コードベースを統合できます。
— joeytwiddle
1
sass.jsは、less.jsの143kbサイズ（gzip）と比較して、670KB（gzip）のサイズがかなり大きいようです。また、less.jsと比較してcss変数を動的に設定するオプションがsass.jsにありません。これは、theamableサイトがある場合に非常に役立ちます
— Anirudha
7

はい

予想していたように、C ++で書き直した後、Emscriptenを介してJavascriptでコンパイルすることが可能です。

これはブラウザのバージョンです：https : //github.com/medialize/sass.js/

彼らが推奨するように、ノードにはこれを使用できます：https : //github.com/sass/node-sass

— ニコロザ
ソース
2
これと（現在受け入れられている）回答の組み合わせが、実際に受け入れられた回答になります。
— plaidcorp 2017
5

すべてのユーザーにスタイルシートをコンパイルさせるべきではありませんが、JavaScript実装もサーバー上で実行できます。node.jsアプリで使用するためのJavaScript sass実装も探しています。これはサスチームが考えていることですか？

— Tilleryj
ソース
3
SASS.jsを本番環境で使用したくない！SASSのためだけにrubyをインストールする必要なく、開発マシンをデプロイできるようにしたい。開発が完了すると、任意のマシンでSASSを処理し、結果のCSSを本番サーバーに移動できます。
— A.MatíasQuezada
1
Nodeプロジェクトでsassの代わりにStylusを使用することを検討することをお勧めします。
— airtonix 2013
1

なぜLibSassなのか

正式に認可されたsassのJavaScript実装はありませんが、LibSassとして知られるSassエンジンの公式のC / C ++移植版があります。LibSassは公式の実装であるため、内部でLibSassを使用するJavaScriptライブラリを選択することをお勧めします。

サーバー上

Node.js環境で実行されるJavaScriptには、Node-sassがあります。

内部的には、Node-sassはLibSass自体を使用します。

ブラウザで

ブラウザで実行されるJavaScriptには、Sass.jsがあります。

内部的には、Sass.jsはEmscriptenで JavaScriptに変換されたバージョンのLibSass（これを書いている時点ではv3.3.6）を使用しています。

— ジョン・スレガーズ
ソース
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.