vscode 全局安装和配置 stylelint 像 webstorm 等 ide 一样来检查项目

商店里安装完插件以后全局安装或者在项目中(记得加--save-dev)安装配置:

npm install stylelint-config-recommended -g

 

然后在vscode setting中设置配置文件位置

  "stylelint.config": {
    "extends": "C:\\Users\\用户名\\AppData\\Roaming\\nodejs\\npm-global\\node_modules\\stylelint-config-recommended"
  }

应该就ok了

 

吐槽下vscode-stylelint的作者好傲娇,没有写安装完怎么配置。。。

看了看里面的几个issues基本上处理很快,但是都是说“你们不看文档,不能怪作者”。

作者大爷给指了条明路,让去查stockoverflow。找了个问题,基本有些思路。

然后在AtomLinter的linter-stylelint的issues中找到解答。davidtheclark 大大真nice啊。

github项目地址

参考地址

转载于:https://www.cnblogs.com/eastegg/p/9244135.html

### 配置 StylelintWebStorm 中 为了在 WebStorm 中成功配置并使用 Stylelint,确保安装了必要的依赖包。通过执行如下命令来安装这些工具: ```bash pnpm add sass sass-loader stylelint postcss postcss-scss postcss-html stylelint-config-prettier stylelint-config-recess-order stylelint-config-recommended-scss stylelint-config-standard stylelint-config-standard-vue stylelint-scss stylelint-order stylelint-config-standard-scss -D ``` 此命令会安装 Stylelint 及其推荐的相关插件配置文件[^1]。 #### 创建或更新 `.stylelintrc` 文件 创建一个名为`.stylelintrc.json` 的 JSON 文件,在项目根目录下定义 Stylelint 规则。例如: ```json { "extends": [ "stylelint-config-standard", "stylelint-config-standard-scss" ], "rules": { "indentation": 2, "number-leading-zero": null } } ``` 这将扩展标准 SCSS CSS 规范,并允许自定义特定规则设置。 #### 安装 Stylelint 插件到 WebStorm 打开 WebStorm 并导航至 `File | Settings (Ctrl+Alt+S)` 对于 Windows/Linux 或者 `WebStorm | Preferences... (Cmd+,)` 对于 macOS 用户。接着前往 `Languages & Frameworks | Style Sheets | StyleLint` 路径下的选项卡。勾选 Enable checkbox 后点击 `Configure path to linter` 输入框右侧的省略号按钮 (`…`) 来指定本地 Node.js 环境中的 Stylelint 执行路径。通常情况下,默认值即可满足需求;如果遇到问题,则需手动输入绝对路径指向全局或局部安装好的 Stylelint 版本位置。 完成上述操作之后,重启 IDE 让更改生效。现在应该可以在编辑器内看到实时样式错误提示以及警告信息了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值