uniapp cli的方式安装scss 不成功 记录一下问题

最新推荐文章于 2024-04-19 16:49:54 发布
最新推荐文章于 2024-04-19 16:49:54 发布
阅读量440 收藏
点赞数
文章标签： uni-app scss 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Ztc666841/article/details/129741633
版权

 

执行命令  npm install node-sass -D

                npm install sass -D

如果执行完了上述的命令行还报错

报 node-sass@7.0.1 postinstall: `node scripts/build.js`

这个时候在命令行直接执行下边的命令就可以解决了

npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass

Ztc666841
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uni-app中使用scss的示例代码
12-14
遇到的坑 整个一个下午我都在解决uni-app中使用scss的坑，首先说一下我的问题，在用scss时一直不能使用@mixin，然后百度各种办法调试： 代码写法问题（完全按官网的写法来的不可行）: 官网demo 浏览器问题（换火狐不行）。 语法版本问题（换了写法同样不行）: scss使用mixin不生效，浏览器无法编译出来 插件没有安装上（重装还是不好使）。 把<style type=’css’> 改成了 scss ， 还是不行。 使用scss新语法还时不行 整个一下午实在是弄不出来，没办法的情况下，想着直接用vue的中安装scss的方法来操作一下试试，结果还真可以了。 需要注意的是不能全局
UniAppCli安装sass失败或报错问题
weixin_42776027的博客
05-25 1571
关于SCSS 依赖SCSS，您必须要安装此插件，否则无法正常运行。 如果您的项目是由HBuilder X创建的，相信已经安装scss插件，如果没有，请在HX菜单的 工具->插件安装中找到"scss/sass编译"插件进行安装， 如不生效，重启HX即可 如果您的项目是由vue-cli创建的，请通过以下命令安装对sass(scss)的支持，如果已安装，请略过。 // 安装sass npm i sass -D // 安装sass-loader，注意需要版本10，否则可能会导致vue与sass的兼容
cli构建uniapp项目＋sass＋uview＋tailwind
最新发布
YX_0719的博客
04-19 1571
uni-app HBuilderX模板项目转为cli项目＋sass＋uview＋tailwind，node与各依赖版本兼容性
创建uni-app项目及安装scss插件
ajiang0622的博客
11-09 4171
uni-app在手，做啥都不愁 -什么是uni-app? 一个使用 Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。 一套代码编到13个平台 uni-app官网：https://uniapp.dcloud.io/ uView :https://www.uviewui.com/ -快速上手 1、创建uni-app项目 这里用到的是HBuilderX 点击
如何在vue-cli创建的uniapp项目中使用scss
徐忠炜的博客
11-29 1622
官网是这样说的：cli版如果想安装less、scss、ts等编译器，需自己手动npm安装。在HBuilderX的插件管理界面安装无效，那个只作用于HBuilderX创建的项目。 所有我们只需安装node-sass和sass-loader即可正常使用scss 执行以下命令： npm i node-sass@4.14.1 sass-loader@7 -D ...
关于在uniapp中安装sass版本问题(vue-cli命令行创建版)
顾风的博客
07-06 1573
关于在uniapp中安装sass版本问题(vue-cli命令行创建版) sass版本问题 node-sass与sass-loader
uniapp vue2 scss 前端模块-简洁注册页模版
07-25
预览：https://img-blog.csdnimg.cn/c26a64c14d3543afa3ded3e81b7475b6.png 说明：前端模块-简洁注册页模版 框架：uniapp 技术站：vue2、scss
vue-cli中安装方法(图文详细步骤)
01-21
vue-cli脚手架模板是基于node下的npm来完成安装的所以首先需要安装node 1、安装node，vue运行需要基于npm一定的版本，所以首先升级npm到最新的版本，而在安装的过程中个人比较喜欢淘宝的镜像，所以先安装cnpm（因为...
vue安装和使用scss及sass与scss的区别详解
12-10
1. 安装依赖：npm install node-sass sass-loader -D 2. webpack.base.conf.js文件 module: { { //手动添加这一条，相当于是编译识别sass! test: /\.scss$/, loaders: ["style", "css", "sass"]} } 3. 在.vue文件...
解决vue scoped scss 无效的问题
11-19
今天遇到scoped内部的scss设置无效，解决办法如下： /deep/ <style scoped lang="scss"> .position-el-steps { /deep/ .el-step.is-vertical { .el-step__description { margin-top: -20px; } .el-step_...
vue-cli中如何引入scss
User_XuKang的博客
10-29 703
1.sass安装 需要引入依赖node-sass、sass-loader、style-loader （切记必须要指定版本） 安装命令：cnpm install node-sass@^4.14.1 --save-dev cnpm install sass-loader@^7.3.1 --save-dev cnpm install style-loader --save-dev 版本太高或太低会导致webpack在编译的时候出错误...
Mac下通过vue-cli创建的uni-app项目中使用sass
xyf的博客
07-15 2362
一、创建项目 uni-app官网上提供了 HBuilderX可视化界面、vue-cli命令行 两种方式创建项目。 二、安装sass 通过可视化界面创建的： 在HBuilderX - 工具 - 插件安装 -找到scss/sass编译插件栏目，进行安装。 通过vue-cli命令行创建的： uni-app官网上已经明确说明了cli版如果想安装less、scss、ts等编译器，需自己手动npm安装。在HBuilderX的插件管理界面安装无效，那个只作用于HBuilderX创建的项目。 OK，那我们开.
vue-cli方式完整搭建和配置uniapp+ts+sass项目总结
BayMin0-0的博客
03-18 2295
1.环境准备 已安装node运行环境(未安装的自行百度安装) 安装node后使用npm管理包命令执行下载cnpm和yarn(不懂请自行百度) 2.搭建项目 全局安装vue-cli，window窗口命令如下：npm install -g @vue-cli 使用vue-cli创建uniapp项目，window窗口命令如下：vue create -p dcloudio/uni-preset-vue 你的项目名称(注意需要全小写) ...
使用vue-cli创建uni-app项目（vue2版本）
一个韩韩韩
07-22 7994
1.全局安装vue-cli npm install -g @vue/cli
uni-app全局引入scss文件的不同方式
热门推荐
Moon Star
11-01 1万+
1. 使用config方式引入 在项目下创建vue.config.js文件 module.exports = { css: { loaderOptions: { scss: { prependData: `@import "~@/static/style/index.scss";` } } } } Tips：根据scss版本确定配置，版本低的使用“data”，高的使用“prependData” 在/static/style/index.scss文件中，引入其他
【uni-app】uni-app安装scss/sass后报错：win32-x64-64_binding.node is not a valid Win32 application
weixin_39085822的博客
11-26 4269
当我们下载HbuilderX编辑器，安装scss/sass编译插件时，报错： 现象： 这段信息告诉我们，我当时开发环境安装的node-sass中win32-ia32-72目录下binding.node这个文件丢失，需要下载补充 或： \HBuilderX\plugins\compile-node-sass\node_modules\node-sass-china\vendor\win32-ia32-72\binding.node is not a valid Win32 application. 这段信
uni-app 之 安装uView，安装scss/sass编译
jun_tong的博客
09-04 1487
uni-app 之 安装uView，安装scss/sass编译
解决uni-app安装scss报错的情况
qq_44170622的博客
11-25 2736
https://blog.csdn.net/weixin_46648362/article/details/109435748 主要解决安装uni-app安装scss报错的情况
vue之安装sass艰辛踩坑（uni-app+uview-ui项目）
dogmiaomiao的博客
04-01 1827
我安装过程中才知道的事情： 我安装sass，npm是v6.14.13版本 ，node是v14.17.0版本，sass是v4.14.1版本，才得已成功！ 之前我node是v16的版本，死活安装报错，不知道原因 HbuildX编辑器内部的node-sass插件只支持到node v12的版本， vscode内部插件应该可以支持更高版本的node以及最新版本的sass，没试过，不知道。 但是sass已经不做停止做市场更新和维护了 ======================================
uniapp 安装scss
07-16
要在uni-app中使用SCSS，你需要进行以下步骤： 1. 确保你的uni-app项目已经安装了Node.js和npm。 2. 打开你的uni-app项目的根目录，并在命令行中运行以下命令来安装 `node-sass` 和 `sass-loader`： ```bash npm install node-sass sass-loader --save-dev ``` 3. 上述命令会安装所需的依赖包，并将它们添加到 `package.json` 文件中的 `devDependencies` 中。 4. 在项目的根目录下找到 `vue.config.js` 文件（如果没有则创建一个），并添加以下内容： ```javascript module.exports = { css: { loaderOptions: { sass: { prependData: `@import "@/assets/styles/variables.scss";` } } } }; ``` 在上述代码中，我们使用了 `prependData` 选项来引入一个全局的SCSS文件，可以根据你的项目需求修改引入路径。 5. 在你的uni-app项目的 `src/assets/styles` 目录下创建一个名为 `variables.scss` 的文件，并在其中定义你的SCSS变量和样式。示例代码如下： ```scss $primary-color: #007bff; .button { background-color: $primary-color; color: #fff; } ``` 在上述代码中，我们定义了一个 `$primary-color` 变量，并在 `.button` 类中使用它。 6. 在你的uni-app项目中的组件或页面中，你可以直接引用SCSS文件并使用其中定义的变量和样式。示例代码如下： ```vue <template> <view class="button">This is a button</view> </template> <style lang="scss"> @import "@/assets/styles/variables.scss"; .button { background-color: $primary-color; color: #fff; } </style> ``` 通过以上步骤，你就可以在uni-app中成功安装和使用SCSS了。记得重启你的项目以使改动生效。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值