当前位置: 首页 > news >正文

放弃node-sass,启用sass

在下载一个新项目时运行:npm run install 发现报错 npm uninstall 异常

Error: Could not find any Visual Studio installation to use
或是
-------------------------
You need to install the latest version of Visual Studio
npm ERR! gyp ERR! find VS including the "Desktop development with C++" workload.
npm ERR! gyp ERR! find VS For more information consult the documentation at:
npm ERR! gyp ERR! find VS https://github.com/nodejs/node-gyp#on-windows
---------------------------

运行 npm install --global --production windows-build-tools 在install 如果没有效果,下载 https://visualstudio.microsoft.com/zh-hans/downloads/ 新版 visual studio
目前最新是 visual studio Community 2022 ,勾选c++,安装完成后
在这里插入图片描述
在这里插入图片描述

运行:npm config set msvs_version=2022 重新install 基本上可以成功了。

为什么放弃node-sass,

选择dart-sass的理由 官网

  1. Sass 是一种 CSS 的预编译语言。它提供了 变量(variables)、嵌套(nested rules)、 混合(mixins)、
    函数(functions)等功能,并且完全兼容 CSS 语法。Sass 能够帮助复杂的样式表更有条理, 并且易于
    在项目内部或跨项目共享设计。
  2. 在 v4.3.0之前本项目都是基于node-sass进行构建的,但node-sass底层依赖 libsass,导致很多用户安装
    的特别的困难,尤其是 windows用户,它强制用户在windows环境中必须安装python2和Visual Studio才
    能编译成功。 所以为了解决这个问题,本项目在v4.3.0修改为dart-sass进行构建,它能在保证性能的前
    提下大大简化用户的安装成本。通过这个issue下面相关的评论就可以知道,安装 node-sass 是多么麻烦 的
    一件事。
  3. 这里选择使用dart-sass还有一个更主要的原因,sass官方已经将dart-sass作为未来主要的的开发方向了
    ,有任何新功能它都是会优先支持的,而且它已经在社区里稳定运行了很长的一段时间,基本没有什么
    坑了。dart-sass之所以容易安装,主要是因为它会被编译成纯 js,这样就可以直接在的 node 环境中使用
    。虽然这样它的运行速度会比基于 libsass的慢一些些,但这些速度的差异几乎可以忽略不计。整个社区
    现在都在拥抱dart-sass,我们没有理由拒绝!而且它的确大大简化了用户的安装成本。

不选择node-sass的理由,弃用背景

  1. node-sass在npm安装的时候大概率的会安装出错,或下载时间过长,因此考虑用dart-sass来替换
  2. node-sass已经停止更新

node-sass与dart-sass区别

  • node-sass 是用 node(调用 cpp 编写的 libsass)来编译 sass;
  • dart-sass 是用 drat VM 来编译 sass;
  • node-sass是自动编译实时的,dart-sass需要保存后才会生效
  • 推荐 dart-sass 性能更好(也是 sass 官方使用的),而且 node-sass 因为国情问题经常装不上

dart-sass优势

  • 不存在依赖二进制文件即可完成安装,避免了node-sass因为依赖其他文件而失败
  • 允许使用sass和css新特性
  • 避免工程其他依赖升级的不兼容node-sass导致报错的问题

dart-sass缺陷

  • 性能:由于node-sass使用C++实现的样式预处理器,速度相比于纯Javascript实现Dart Sass要快
  • 内存:执行编译过程中,Node Sass的内存占用也比Dart Sass要小很多

删除node-sass 安装sass

npm install node-sass
npm install sass -D

异常提示:

在这里插入图片描述
nuxt项目异常提示: You did not set any plugins, parser, or stringifier. Right now, PostCSS does nothing. Pick plugins for your case on https://www.postcss.parts/ and use them in postcss.config.js.

解决方案

npm i -D @nuxt/postcss8 @nuxtjs/style-resources

在nuxt.config.js中添加配置

buildModules: ['@nuxtjs/style-resources','@nuxt/postcss8',
],

相关文章:

放弃node-sass,启用sass

在下载一个新项目时运行:npm run install 发现报错 npm uninstall 异常 Error: Could not find any Visual Studio installation to use 或是 ------------------------- You need to install the latest version of Visual Studio npm ERR! gyp ERR! find VS incl…...

力扣旋转字符串

🎈个人主页:🎈 :✨✨✨初阶牛✨✨✨ 🐻推荐专栏: 🍔🍟🌯 c语言初阶 🔑个人信条: 🌵知行合一 🍉本篇简介:>:介绍字符串旋转,左旋,右旋即旋转结果. 金句分享: ✨好好干&…...

Java 代码组织机制

包 使用任何语言进行编程都有一个相同的问题,就是命名冲突。 包类似于计算机中的文件夹,正如文件放在文件夹中,类和接口放在包中,为便于组织,文件夹一般是一个层次结构,包也类似。 包有包名,…...

【剧前爆米花--爪哇岛寻宝】MySQL中索引和事务

作者:困了电视剧 专栏:《MySQL数据库》 文章分布:这是一篇关于Java中异常类的文章,在本篇文章中详细讲解了异常的使用逻辑和底层的执行过程,如有疏漏,欢迎大佬指正! 目录 索引 用法 底层逻辑…...

C++ 线程库

文章目录thread 创建mutexmutexrecursive_mutextimed_mutexlock_guard原子操作atomic条件变量condition_variable其他线程安全问题shared_ptr单例模式C 线程库是 C11 标准中引入的一个特性,它使得 C 在语言级别上支持多线程编程,不需要依赖第三方库或操作…...

python字典和集合——笔记

一、介绍 1、泛映射类型 collections.abc模块中有Mapping和MutableMapping这两个抽象基类,它们的作用是为dict和其他类似的类型定义形式接口(在Python 2.6到Python 3.2的版本中,这些类还不属于collections.abc模块,而是隶属于coll…...

TEX:显示文本

文章目录字体选择字体fontspec宏包根据字体形状控制字体为不同的字体形状选择不同的特征为不同的字体大小状选择不同的特征中文字体选择xeCJK宏包字体选择与设置XELATEX字体名查找字体集与符号居中与缩进居中单边调整两边缩进诗歌缩进列表itemize样例enumerate样例description样…...

SS-ELM-AE与S2-BLS相关论文阅读记录

Broad learning system for semi-supervised learning 摘要:本文认为,原始BLS采用的稀疏自编码器来生成特征节点是一种无监督学习方法,这意味着忽略了标注数据的一些信息,并且难以保证同类样本之间的相似性和相邻性,同…...

ESP32设备驱动-MAX6675冷端补偿K热电偶数字转换器

MAX6675冷端补偿K热电偶数字转换器 1、MAX6675介绍 MAX6675执行冷端补偿并将来自K型热电偶的信号数字化。 数据以 12 位分辨率、SPI™ 兼容的只读格式输出。 该转换器可将温度解析为 0.25C,读数高达 +1024C,并且在 0C 至 +700C 的温度范围内具有 8 LSB 的热电偶精度。 MAX…...

Python基础知识汇总(字符串四)

目录 字母的大小写转换 lower()方法 upper()方法 删除字符串中的空格和特殊字符 strip()方法...

C语言学习笔记——指针(初阶)

前言 指针可以说是C语言基础语法中最难的理解的知识之一,很多新手(包括我)刚接触指针时都觉得很难。在我之前发布的笔记中都穿插运用了指针,但是我一直没有专门出一期指针的笔记,这是因为我确实还有些细节至今还不太清…...

阿赵的MaxScript学习笔记分享十二《获取和导出各种数据》

大家好,我是阿赵,周日的早上继续分享MaxScript学习笔记,这是第十二篇,获取和导出各种数据 1、导出数据的目的 使用3DsMax建立3D模型后,很多时候需要输出模型到别的引擎去使用,常用的格式有Obj、FBX、SLT等…...

react-draggable实现拖拽详解

react-draggable属性常用属性属性列表事件列表举例首先安装 react-draggable实现移动希望小编写的能够帮助到你😘属性 常用属性 属性默认值介绍axisxhandle拖动的方向,可选值 x ,y,bothhandle无指定拖动handle的classposition无handle的位置&#xff0…...

01.进程和线程的区别

进程和线程的区别进程和线程是计算机中的两个核心概念,它们都是用来实现并发执行的方式,但是它们在实现并发的方式和资源管理方面有一些重要的区别。进程是一个程序的运行实例。每个进程都有自己的内存空间、代码、数据和系统资源(如文件描述…...

逻辑优化-rewrite

简介 逻辑综合中的rewrite算法是一种常见的优化算法,其主要作用是通过对逻辑电路的布尔函数进行等效变换,从而达到优化电路面积、时序和功耗等目的。本文将对rewrite算法进行详细介绍,并附带Verilog代码示例。 一、算法原理 rewrite算法的…...

文件传输与聊天系统设计

技术:Java等摘要:本文介绍了一种基于TCP/IP协议使用Socket技术实现的聊天室系统,包括私聊功能和文件传输功能,对系统的主要模块进行了分析,并对系统实现过程中遇到的关键性技术进行了阐述,最后对系统进行了…...

蓝桥杯第十四届校内赛(第三期) C/C++ B组

一、填空题 (一)最小的十六进制 问题描述   请找到一个大于 2022 的最小数,这个数转换成十六进制之后,所有的数位(不含前导 0)都为字母(A 到 F)。   请将这个数的十进制形式作…...

有关平方或高次方的公式整理一元高次方程的求解

Part.I Introduction 这篇博文记录一下数学中常用的有关平方或高次方的一些公式。 Chap.I 一些结论 下面一部分汇总了一些重要的结论 完全平方公式:(ab)2a22abb2(ab)^2a^22abb^2(ab)2a22abb2平方差公式:a2−b2(ab)(a−b)a^2-b^2(ab)(a-b)a2−b2(ab)(…...

Java笔记3

ArrayListArrayList<String> list new Arraylist<>();<>是泛型表示存放的数据类型&#xff0c;注意不能是基本数据类型&#xff1b;增删改查增&#xff1a;add 返回值为true删&#xff1a;remove 1.直接删元素2.根据索引删元素改&#xff1a;set&#xff08…...

Leetcode.2202 K 次操作后最大化顶端元素

题目链接 Leetcode.2202 K 次操作后最大化顶端元素 Rating &#xff1a; 1717 题目描述 给你一个下标从 0开始的整数数组 nums&#xff0c;它表示一个 栈 &#xff0c;其中 nums[0]是栈顶的元素。 每一次操作中&#xff0c;你可以执行以下操作 之一 &#xff1a; 如果栈非空…...

AI Agent与Agentic AI:原理、应用、挑战与未来展望

文章目录 一、引言二、AI Agent与Agentic AI的兴起2.1 技术契机与生态成熟2.2 Agent的定义与特征2.3 Agent的发展历程 三、AI Agent的核心技术栈解密3.1 感知模块代码示例&#xff1a;使用Python和OpenCV进行图像识别 3.2 认知与决策模块代码示例&#xff1a;使用OpenAI GPT-3进…...

大型活动交通拥堵治理的视觉算法应用

大型活动下智慧交通的视觉分析应用 一、背景与挑战 大型活动&#xff08;如演唱会、马拉松赛事、高考中考等&#xff09;期间&#xff0c;城市交通面临瞬时人流车流激增、传统摄像头模糊、交通拥堵识别滞后等问题。以演唱会为例&#xff0c;暖城商圈曾因观众集中离场导致周边…...

c++ 面试题(1)-----深度优先搜索(DFS)实现

操作系统&#xff1a;ubuntu22.04 IDE:Visual Studio Code 编程语言&#xff1a;C11 题目描述 地上有一个 m 行 n 列的方格&#xff0c;从坐标 [0,0] 起始。一个机器人可以从某一格移动到上下左右四个格子&#xff0c;但不能进入行坐标和列坐标的数位之和大于 k 的格子。 例…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具

文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...

postgresql|数据库|只读用户的创建和删除(备忘)

CREATE USER read_only WITH PASSWORD 密码 -- 连接到xxx数据库 \c xxx -- 授予对xxx数据库的只读权限 GRANT CONNECT ON DATABASE xxx TO read_only; GRANT USAGE ON SCHEMA public TO read_only; GRANT SELECT ON ALL TABLES IN SCHEMA public TO read_only; GRANT EXECUTE O…...

零基础设计模式——行为型模式 - 责任链模式

第四部分&#xff1a;行为型模式 - 责任链模式 (Chain of Responsibility Pattern) 欢迎来到行为型模式的学习&#xff01;行为型模式关注对象之间的职责分配、算法封装和对象间的交互。我们将学习的第一个行为型模式是责任链模式。 核心思想&#xff1a;使多个对象都有机会处…...

自然语言处理——Transformer

自然语言处理——Transformer 自注意力机制多头注意力机制Transformer 虽然循环神经网络可以对具有序列特性的数据非常有效&#xff0c;它能挖掘数据中的时序信息以及语义信息&#xff0c;但是它有一个很大的缺陷——很难并行化。 我们可以考虑用CNN来替代RNN&#xff0c;但是…...

关于 WASM:1. WASM 基础原理

一、WASM 简介 1.1 WebAssembly 是什么&#xff1f; WebAssembly&#xff08;WASM&#xff09; 是一种能在现代浏览器中高效运行的二进制指令格式&#xff0c;它不是传统的编程语言&#xff0c;而是一种 低级字节码格式&#xff0c;可由高级语言&#xff08;如 C、C、Rust&am…...

多模态大语言模型arxiv论文略读(108)

CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文标题&#xff1a;CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文作者&#xff1a;Sayna Ebrahimi, Sercan O. Arik, Tejas Nama, Tomas Pfister ➡️ 研究机构: Google Cloud AI Re…...

Typeerror: cannot read properties of undefined (reading ‘XXX‘)

最近需要在离线机器上运行软件&#xff0c;所以得把软件用docker打包起来&#xff0c;大部分功能都没问题&#xff0c;出了一个奇怪的事情。同样的代码&#xff0c;在本机上用vscode可以运行起来&#xff0c;但是打包之后在docker里出现了问题。使用的是dialog组件&#xff0c;…...