【 CSS 】sass 扩展语言的安装

一、全局安装node-sass

Sass世界上最成熟、稳定和强大的CSS扩展语言 | Sass中文网

https://www.npmjs.com/package/node-sass NPM镜像_NPM下载地址_NPM安装教程-阿里巴巴开源镜像站

注意:nodejs版本14以上,否则node-sass安装不成功

复制代码
 npm install -g mirror-config-china --registry=http://registry.npm.taobao.org
 npm install node-sass -g

怎么确定安装成功了 node-sass -v

如果使用npm下载失败

可以尝试使用cnpm

复制代码
//https://www.npmjs.com/package/cnpm
npm install cnpm -g --registry=https://registry.nlark.com
cnpm install node-sass -g

1- 如果安装失败 提示信息 error mkdir perssion ,权限不够- 开始菜单 搜 cmd 右键 管理员身份运行 ,再去执行 npm install -g mirror-config-china --registry=http://registry.npm.taobao.org npm install node-sass -g

2- 先cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org

cnpm install -g mirror-config-china --registry=http://registry.npm.taobao.org cnpm install node-sass -g

3-network error 连接手机 wifi

4-vscode sass less

5-本地安装

npm install -g mirror-config-china --registry=http://registry.npm.taobao.org npm install node-sass

借助npm scripts {"sass":"node-sass -r -w scss -o css"} npm run sass

  1. 命令

node-sass -w 源文件 目标文件

node-sass -r 文件夹 -o 目标文件夹 node-sass -w -r 文件夹 -o 目标文件夹 node-sass -w -r scss -o css node-sass scss -o css 直接把scss文件夹里的scss全部编译到css文件夹

node-sass -r scss -o css --output-style compressed

node-sass 1-test.scss 1-test-min.css --output-style compressed

css 预处理器 less sass stylus

二、node-sass安装慢的解决方法或者多次安装失败

参照node-sass 文档 先安装 镜像配置,再安装node-sass https://www.npmjs.com/package/node-sass

复制代码
    npm install -g mirror-config-china --registry=http://registry.npm.taobao.org
    
    npm install node-sass -g

三、全局安装失败的解决方法

终端中有这个报错信息 ,但是 Administrator 可能是你的用户名 C:\Users\Administrator\AppData\Roaming\npm\node_modules 在文件系统中找到这个目录,把你现在安装的包删掉,重新安装

四、如果是mac电脑安装失败

不要在vscode内置的终端中安装 ,使用mac自带的终端安装 mac npm

如果还是失败

npm i node-sass -D npm i node-sass -g

路径中不要出现中文

cd .. node-sass -w-r scss -o css

npm i cnpm -g cnpm i node-sass -g

相关推荐
小小小小宇几秒前
单点登录(二)
前端
何以解忧,唯有..2 分钟前
Go 语言语句分隔符详解:分号、换行与代码规范
开发语言·golang·代码规范
人邮异步社区6 分钟前
C语言进阶的书籍推荐
c语言·开发语言
yang)13 分钟前
jesd204B应用笔记
网络·笔记
凡人叶枫13 分钟前
Effective C++ 条款33:避免遮掩继承而来的名字
linux·服务器·开发语言·c++·嵌入式开发
10岁的博客13 分钟前
NOIP2010普及组「接水问题」详解:模拟算法与优先队列解法
开发语言·c++·算法
凡人叶枫13 分钟前
Effective C++ 条款31:将文件间的编译依存关系降至最低
linux·开发语言·c++·php·嵌入式开发·effective c++
阿猫的故乡16 分钟前
Vue + Axios 从入门到封装:拦截器、错误处理、请求取消、接口管理全搞定
前端·javascript·vue.js
heimeiyingwang24 分钟前
【架构实战】数据脱敏与隐私保护:合规是底线
java·开发语言·架构
良逍Ai出海31 分钟前
免费模板搭完独立站后,我用 Codex + Figma 做了自己的页面设计
前端·人工智能·figma