今日2.0でプロジェクトを作成したとき、scssの使用に失敗し、エラーを報告し続けました............
次回穴を踏まないように記録します
1.依存関係をインストールします
vueのwebpackプロジェクトでは、node-sass、sass-loader、およびstyle-loaderをインストールする必要があるため、プロジェクトで再度実行します。
npm i node-sass sass-loader style-loader -D
上記のコマンドを実行すると、package.jsonファイルの「devDependencies」プロパティに対応するバージョン番号が表示されます。
2.ローダーを構成します
検索webpack.base.conf.jsファイルでのビルドのディレクトリプロジェクトを。ファイルmodule.exportでmodule.rulesにSCSSファイルを説明するローダーを追加します。具体的な方法は、配列にオブジェクトを追加することです。次のようにオブジェクトの内容があります
{
test: /\.scss$/,
loader: 'sass-loader!style-loader!css-loader',
}
3.言語をscssとして指定します
lang = "scss"を.vueファイルのスタイルタグに追加し、次のように記述します。
<style lang="scss" scoped>
</style>
上記の手順により、sassをプロジェクトで使用できます。
emmこの手順をN回実行してもエラーが報告されました。最終的な解決策：package.jsonファイルを
見てください。ダウンロードは最新バージョンですが、これは不可能です。ダウンロードバージョンを指定します。sass-loader
npm i [email protected] -S
ダウンロード後、プロジェクトを再起動してSCSSを通常どおり使用してください。！
成功しなかった場合は、メッセージを残してください。一緒に解決します。