欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Node升級后vue項目node-sass報錯問題及解決

 更新時間：2023年03月29日 09:52:20   作者：﹏゛Aeljinh陌琳  
這篇文章主要介紹了Node升級后vue項目node-sass報錯問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

Node升級后vue項目node-sass報錯

node升級命令

npm install -g n
sudo n 16.14.0

升級后以前的vue 項目 node-sass 報錯

解決方案

1.卸載原有的node-sass 和 sass-loader

npm uninstall node-sass sass-loader

2.升級項目所有安裝的依賴

npm update

3.安裝sass-loader與sass

npm install -D sass-loader@^10 sass

4.重新打包

npm run dev （如圖2）

5.Syntax Error: SassError: expected selector.

報錯信息表示 /deep/ 寫法的錯，修改為 （如圖3）

若依vue前端node升級記錄

原來的node版本是

node: 14.9.0
node-sass: 4.14.1
sass-loader: 8.0.2

升級后node

node: 15.8.0
node-sass: 6.0.1
sass-loader: 10.3.1

升級后遇到的問題

// 在安裝完合適的sass-loader以后，運行項目報錯，原來項目里全局引入scss文件的配置，sass-loader的版本對于這個在文件之前追加scss代碼的選項名均有不同
sass-loader v8-，這個選項名是 “data”
sass-loader v8 中，這個選項名是 “prependData”
sass-loader v10+，這個選項名是 “additionalData”? css: {
? ? loaderOptions: {
? ? ? sass: {
? ? ? ? additionalData: `@import '@/assets/styles/variables.scss';`,
? ? ? },
? ? },
? },
// 結(jié)果出現(xiàn)了 Syntax Error: SassError: This file is already being loaded. 這個錯誤。原因是將這個scss文件重復(fù)引入了, 修改如下：

? css: {
? ? loaderOptions: {
? ? ? sass: {
? ? ? ? // additionalData: `@import '@/assets/styles/variables.scss';`,
? ? ? ? additionalData: (content, loaderContext) => {
? ? ? ? ? const { resourcePath } = loaderContext;
? ? ? ? ? if (resourcePath.endsWith("variables.scss")) return content;
? ? ? ? ? return `@import "@/assets/styles/variables.scss";?
? ? ? ? ? ${content}`;
? ? ? ? },
? ? ? },
? ? },
? },

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

  • 一文教會你從Windows中完全刪除node.js

    一文教會你從Windows中完全刪除node.js

    作為新手nodejs卸載后安裝就總出錯,下面這篇文章主要給大家介紹了關(guān)于如何從Windows中完全刪除node.js的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
    2022-08-08
  • node中的session的具體使用

    node中的session的具體使用

    這篇文章主要介紹了node中的session的具體使用,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2018-09-09
  • Node.js插件的正確編寫方式

    Node.js插件的正確編寫方式

    正如Node.js在官方說明文檔中所言，插件是以動態(tài)方式進行鏈接的共享式對象，能夠?qū)avaScript代碼與C/C++庫接駁起來。這意味著我們可以引用任何來自C/C++庫中的內(nèi)容，并通過創(chuàng)建插件的方式將其納入到Node.js當中。
    2014-08-08
  • node.js中的fs.readFile方法使用說明

    node.js中的fs.readFile方法使用說明

    這篇文章主要介紹了node.js中的fs.readFile方法使用說明,本文介紹了fs.readFile的方法說明、語法、接收參數(shù)、使用實例和實現(xiàn)源碼,需要的朋友可以參考下
    2014-12-12
  • Node.js中文件系統(tǒng)fs模塊的使用及常用接口

    Node.js中文件系統(tǒng)fs模塊的使用及常用接口

    fs是filesystem的縮寫，該模塊提供本地文件的讀寫能力，基本上是POSIX文件操作命令的簡單包裝。這篇文章主要介紹了Node.js中的文件系統(tǒng)fs模塊的使用,需要的朋友可以參考下
    2020-03-03
  • typescript nodejs 依賴注入實現(xiàn)方法代碼詳解

    typescript nodejs 依賴注入實現(xiàn)方法代碼詳解

    今天分享的是用typescript語言實現(xiàn)的ioc模式，這邊用到的主要組件是 reflect-metadata 這個組件可以獲取或者設(shè)置元數(shù)據(jù)信息，接下來通過本文給大家介紹typescript nodejs 依賴注入實現(xiàn)方法,需要的朋友可以參考下
    2019-07-07
  • npm?工具庫?yenv使用簡介

    npm?工具庫?yenv使用簡介

    這篇文章主要為大家介紹了npm?工具庫?yenv使用簡介，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
    2023-05-05
  • Node.js之網(wǎng)絡(luò)通訊模塊實現(xiàn)淺析

    Node.js之網(wǎng)絡(luò)通訊模塊實現(xiàn)淺析

    本篇文章主要介紹了Node.js之網(wǎng)絡(luò)通訊模塊實現(xiàn)淺析，具有一定的參考價值，有興趣的可以了解一下。
    2017-04-04
  • node?NPM庫promise?異步任務(wù)狀態(tài)管理

    node?NPM庫promise?異步任務(wù)狀態(tài)管理

    這篇文章主要介紹了node?NPM庫promise?異步任務(wù)狀態(tài)管理
    2023-07-07
  • 使用nvm進行多個nodejs版本的統(tǒng)一管理

    使用nvm進行多個nodejs版本的統(tǒng)一管理

    隨著前端項目的越來越多,不同項目使用的nodejs版本可能不一樣,導(dǎo)致在切換不同項目時需要更換不同的nodejs版本,非常麻煩,本次推薦使用nvm進行多個nodejs版本的統(tǒng)一管理,文中有詳細的圖文介紹,需要的朋友可以參考下
    2023-12-12

最新評論