入行到如今,先后折腾过无数的代码编辑器,大概有 sublime、webstorm、hBuilder、webstorm、eclipse、webstorm,vscode。工欲善其事必先利其器,在和如此多的编辑器打交道后,我先下只有 vscode 能够提升开发的幸福感。无论是 vscode 的轻量感还是它的可配置性、拓展性都能给我带来很大的体验。下面我会从 vscode 入手阶段分享我对其
vue安装node-sass编译报错安装node-scss报错安装node-scss报错在搭建vue脚手架 或者是在vue
转载 2022-08-04 10:49:27
183阅读
原创 2022-07-06 12:22:40
97阅读
要如何在我们的vue项目中全局引入scss文件呢?main.js可以直接import css文件,而不可以直接import scss文件。 在index.html中link引入的话,不起作用。 公共样式可以写在app.vue这个父组件的style标签中,这样我们写的子组件就能继承这些公共样式,但是!!!我们自定义的scss的变量继承不了!!如果我们想使用公共的scss样式变量...
转载 2022-05-26 16:48:36
2898阅读
1、 什么是CSS预处理器CSS 预处理器用一种专门的编程语言,进行 Web 页面样式设计,然后再编译成正常的 CSS 文件,以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性,无需考虑浏览器的兼容性问题。CSS预处理语言有SCSS (SASS) 和LESS等等,总之都是用来实现样式的。2、lang因此lang的属性可选:scss(sass)、less等等即:<style lang
转载 2024-05-17 08:05:19
293阅读
目前写过的大多数项目都是cli搭建的, 拿一个简单的项目结构来详细说一下每个目录的作用.首先创建一个项目需要安装cli, 命令行全局npm安装即可npm install -g @vue/cli然后创建一个项目 cli2与cli3的命令是不同的 (project-name就是你的项目名称)vue create project-name // vue-cli3 vue init webpack
转载 2024-09-30 18:06:30
55阅读
首先了解一下sass的知识:sass是一种对css的一种提升,可以通过编译生成浏览器能识别的css文件。sass技术的文件的后缀名有两种形式:.sass和.scss。这两种 ...
转载 2021-07-25 15:28:00
2547阅读
npm install sass-loader node-sass --save-dev 
原创 2022-05-30 11:58:08
1067阅读
一、安装sass 依赖包 npm install sass-loader --save-dev npm install node-sass --sava-dev二、在build文件夹下的webpack.base.conf.js的rules里面添加配置{ test: /\.scss$/, loaders: ['style', 'css', 'sass'] }但是!!vue-cli脚手架已
转载 2023-12-09 11:19:35
554阅读
前言today,is good day,中午吃了个农民工外卖,有点撑,想在床上躺会,TMD,睁开眼天黑了,别说,冬天的上海天黑的挺早,基本上五点半就已经全黑了,住在出租屋的我,却感觉不到上海的灯火通明,繁华,毕竟在我们这些人的眼里,上海是有钱人的上海,它的繁华、它的璀璨与我无关,我只不过是外地过来讨饭的!回归正题吧!我们在写VUE的时候,会使用scss,也会做一些通用样式,方便使用,在写好的通用样式的时候,每次都要单文件导入,刚开始写的时候,感觉还好,后面工程量大了后,就显得麻烦,那么本文就全局导入scs
原创 2022-12-01 17:20:58
409阅读
Sass 是一种 CSS
原创 2023-05-13 09:01:22
111阅读
前天下载了个vue移动端的demo(大家也可以学习一下:https://github.com/toutouping/vue-case),先是运行了cnpm  install ;再运行了npm  run dev  ;然后就报了下面的错误:  对于刚进入编程领域的我来说,一看到这种报错,第一反应就是应该是scss没有安装,打开代码发现,demo里面果然用了scs
报错: Failed to compile../src/App.vue?vue&type=style&index=0&id=7ba5bd90&lang=scss (./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modul ...
转载 2021-09-14 10:39:00
1247阅读
2评论
### 实现VueSCSS全局变量的步骤 在Vue项目中使用SCSS全局变量可以帮助我们更方便地管理样式,提高样式的复用性和维护性。下面是实现VueSCSS全局变量的步骤及代码示例: #### 步骤一:安装SCSS处理器 首先确保你的Vue项目已经安装了SCSS处理器,如果没有可以使用以下命令安装: ```bash npm install sass sass-loader -D ```
原创 2024-05-29 10:09:32
400阅读
有时往往需要一些全局样式,但@import导入未免麻烦,这时可以使用vue插件style-resources-loader。 默认情况下 Vue.js 是不支持 Sass、Scss 的,如果想要使用它们,只需要一些简单的安装配置即可。 1、安装node-sass和sass-loader npm i ...
转载 2021-08-14 10:41:00
2915阅读
2评论
cnpm install node-sass --save-dev //安装node-sass cnpm install sass-loader --save-dev //安装sass-loader cnpm install style-loader --save-dev //安装style-loader安装完成后,如果运行报以下错:Module build failed...
原创 2022-02-25 12:27:36
66阅读
# 使用 Yarn 在 Vue 3 项目中安装 SCSS 在现代前端开发中,使用样式预处理器能够提升我们的 CSS 编写效率,SCSS 就是其中最流行的一种。随着 Vue 3 的发布,它对现代开发者的支持更加友好。在这篇文章中,我们将学习如何在 Vue 3 项目中使用 Yarn 安装 SCSS,并展示相关的代码示例和基本的使用方法。 ## 1. 前期准备 在开始之前,你需要确保你的开发环境已
原创 2024-10-15 07:12:08
549阅读
sass的变量必须是$开头,后面紧跟变量名,而变量值和变量名之间就需要使用冒号(:)分隔开(就像CSS属性设置一样),如果值后面加上!default则表示默认值。 ![这里写图片描述]() 1、普通变量:定义之后可以在全局范围内使用。scss语法:$fontSize: 12px; body{ font-size:$fontSize; }css输出:body{ font-s
转载 2024-10-23 06:32:00
98阅读
npm install node-sass --save-dev //安装node-sass npm install sass-loader --save-dev //安装sass-loader npm install style-loader --save-dev //安装style-loader
转载 2020-02-19 19:42:00
233阅读
今天遇到scoped内部的scss设置无效,解决办法如下:/deep/ .position-el-steps { /deep/ .el-step.is-vertical { .el-step__description { margin-top: -20px; } .el-step__line { border-left: 2px dashed #c0c4cc; background-color:
  • 1
  • 2
  • 3
  • 4
  • 5