Vue CLI CSSプリプロセッサオプション：dart-sass VS node-sass？

Question 1

CLI（v3.7.0）を使用して新しいプロジェクトを作成する場合dart-sass、node-sassコンパイラーを選択するオプションがあります。

Vueのドキュメントで宣言されているよりも具体的に、これらは互いにどのように比較されますか？

Sassパフォーマンスに関するヒント

Dart Sassを使用する場合、非同期コールバックのオーバーヘッドのため、同期コンパイルはデフォルトで非同期コンパイルの2倍の速度であることに注意してください。このオーバーヘッドを回避するために、ファイバーパッケージを使用して、同期コードパスから非同期インポーターを呼び出すことができます。これを有効にするには、プロジェクトの依存関係としてファイバーをインストールするだけです。

npm install -D fibers

また、ネイティブモジュールであるため、OSやビルド環境によって互換性の問題が異なる場合があることにも注意してください。その場合は、実行npm uninstall -D fibersして問題を解決してください。

? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): (Use arrow keys)
❯ Sass/SCSS (with dart-sass)
  Sass/SCSS (with node-sass)
  Less
  Stylus

編集2020/01： Vue CLI 4.2.2新しいプロジェクトの作成はdart-sass、前の最初のオプションとしてまだ提案されていますnode-sass。それでもnode-sass、よりパフォーマンスの高い選択肢であることがここで確立されており、ダーツサスを使用する人はほとんどいません（ccleveのコメント）。

EDIT 2020/09：としてアリBahramiは彼の豊富な答えを更新し、dart-sass好ましい選択肢であるとしてnode-sass廃止予定としてマークされています。

dart-sassJSでコンパイルされたバージョンはパフォーマンスが悪いので残念です。ただし、開発者はこれを十分に認識しており、この号で述べられているように、パフォーマンスの向上に取り組んでいます。

Question 2

2020年9月17日更新：

この回答は毎日賛成票を投じているので、このトピックをさらに深く掘り下げる価値があるのではないかと思いました。

sass-langのWebサイトを検討する：

Dart SassはSassの主要な実装です。つまり、他の実装よりも前に新しい機能を取得します。高速でインストールが簡単で、純粋なJavaScriptにコンパイルされるため、最新のWeb開発ワークフローに簡単に統合できます。

Dart-Sassは高速ですが、JSコンパイルバージョンではありません。実際には、Dart-Sassと言うとき、2つのオプションがあります。

Dart-VM上のDart-Sass
純粋なJSコンパイルバージョンであるNPMのDart-Sass

Bootstrap 4 SassファイルをNode-Sass、Dart-Sass、Dart-Sass（JS）を使用してCSSにコンパイルすると、次の結果が表示されます。

この特定のケースでは、2秒は大したことではありません。ただし、Dart-Sass（JS）はDart-Sass（Dart VM）の9倍、node-sassの3倍遅いと考えてください。
+20テーマのプロジェクトがあり、node-sassでは30秒かかりましたが、Dart-Sass（JS）を使おうとすると、1世紀かかりました！
Dart-Sass（Dart VM）が最速ですが、インストールや統合には少し注意が必要です。
また、Node-Sassは非推奨と見なされます。

私はここでそれについてブログを書きました、あなたはそれについてもっと読むことができます。

Question 3

node-sassはdart-sassよりも高速かもしれませんが、これを書いている時点では、このdart-sassは、@useルールを実装する唯一のライブラリであり、よりも強く推奨されてい@importます。公式のsass-langウェブサイトによると：

何が問題なの@importですか？この@importルールには、いくつかの重大な問題があります。

@importすべての変数、ミックスイン、および関数をグローバルにアクセス可能にします。これにより、人々（またはツール）がどこで定義されているかを判断することが非常に困難になります。

すべてがグローバルであるため、名前の衝突を避けるために、ライブラリはすべてのメンバーの前にプレフィックスを付ける必要があります。

@extend ルールもグローバルであるため、どのスタイルルールが拡張されるかを予測することは困難です。

各スタイルシートが実行され、@import編集されるたびにそのCSSが発行されるため、コンパイル時間が長くなり、出力が肥大化します。

ダウンストリームスタイルシートにアクセスできないプライベートメンバーまたはプレースホルダーセレクターを定義する方法はありませんでした。

新しいモジュールシステムと@useルールは、これらすべての問題に対処します。

また、@importされ、徐々に段階的に廃止今後数年間にわたり、そして最終的には完全に言語から削除。

Sassのベストプラクティスを最新の状態に保つには、今のところdart-sass（つまりsass）を使用する必要があります。