ホームページ  >  記事  >  ウェブフロントエンド  >  Node16+ が対応する Sass 環境をどのように構成するかをすぐに理解する

Node16+ が対応する Sass 環境をどのように構成するかをすぐに理解する

青灯夜游
青灯夜游転載
2021-12-20 18:20:175612ブラウズ

node-sass のバージョンがローカルの node バージョンと異なる場合、エラーが報告されます。それでは、node は対応する sass 環境をどのように設定するのでしょうか? この記事では、node16 で対応する sass 環境を設定する方法を紹介します。

Node16+ が対応する Sass 環境をどのように構成するかをすぐに理解する

私の新しい同僚は私の以前のプロジェクトを実行しようとしましたが、どうやっても実行できませんでした。彼は node-sass を報告し続けました。エラーが発生し、長い時間がかかりました。未解決で、とても苦痛です。

  • の同僚の node のバージョンが私のローカルの node バージョンと異なることがわかりました。彼は 16 私は##14 です、とても拷問です。情報をクエリした結果、node の各バージョンに対応する sass は異なることがわかりました。
  • #1.node-sass を正確に使用してください

node-sass 対応表##参考 (https://www.npmjs.com/package/node-sass)

Node16+ が対応する Sass 環境をどのように構成するかをすぐに理解する

ノード 16 の正しいバージョンの状態

#package.json#

"node-sass": "^6.0.1",
"sass-loader": "^10.0.1",

  • vue.configl .js
  • グローバル変数も変更する必要があります
    loaderOptions: {
      sass: {
        //以下两种都可以
        additionalData: `@import "~@a/scss/entrance.scss";`//sass-laoder 10+版本
        //prependData: `@import "./src/assets/scss/entrance.scss";`// sass-loader 8+版本
      },
  • node-sass と sass-loader の一致

sass-loader 4.1.1,node-sass 4.3.0
sass-loader 7.0.3,node-sass 4.7.2
sass-loader 7.3.1,node-sass 4.7.2
sass-loader 7.3.1,node-sass 4.14.1
ノードのバージョンを自由に切り替えてさまざまなバージョンに適応できるように、ノード管理ツール nvm

を使用することをお勧めします。プロジェクト環境。

    nvm リファレンス:
  • https://blog.csdn.net/weixin_44748205/article/details/115118322

2. dart-sass の使用がより推奨されます

今後の主流の方向性は dart-sass

    Use
  • 1 、アンインストール
  • node-sass
  • 2、インストール
"sass": "1.32",
"sass-loader": "^10.0.5",

3、警告問題が発生しました。issues を参照してください。ダウングレードすると # を達成できます。
##詳細 ノード関連の知識については、

nodejs チュートリアル

を参照してください。 !

以上がNode16+ が対応する Sass 環境をどのように構成するかをすぐに理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はjuejin.cnで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。