在vue中使用stylus文件遇到的坑！

最新推荐文章于 2023-01-10 10:12:17 发布
最新推荐文章于 2023-01-10 10:12:17 发布
阅读量299 收藏 1
点赞数 3
分类专栏： VUE框架学习笔记 乱七八糟出其不意的知识 文章标签： stylus java vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42136832/article/details/120674288
版权

在vue中使用stylus文件遇到的坑！

网上的解答，我不行…

npm install stylus stylus-loader --save-dev

这个别人都可以，我不行，用了之后会报错，出来一大串，比较戳眼睛的就是

peer webpack@"^5.0.0" from stylus-loader@6.1.0
但凡出现这种的就是版本不合适

解决办法

先在package.json文件配置(手动添加依赖)

"devDependencies": {
    ...
    "stylus": "^0.54.8",
    "stylus-loader": "^3.0.2",

    ...
      },

然后卸载之前的版本

npm uninstall stylus stylus-loader

重新安装

npm install stylus stylus-loader

使用npm install重新建立依赖

最后重新npm run dev启动项目就可以看到端口号运行成功了！

钧桐
关注
  • 3
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
webpack的使用
快乐de馒头
12-20 388
一、在网页中会引用哪些常见的静态资源？ JS 常见的js文件后缀名： .js .jsx .coffee .ts（TypeScript 类 C# 语言） CSS 常见的css文件后缀名：.css .less .sass .scss Images 常见的图片文件后缀名：.jpg .png .gif .bmp .svg 字体文件（Fonts） ...
解决vue-cli中stylus无法使用的问题方法
08-30
然而，在使用Vue CLI的过程中，有时会遇到一些技术问题，比如在本例中提到的"vue-cli中stylus无法使用"的问题。Stylus是一种流行的CSS预处理器，它提供了更丰富的语法和功能，如变量、嵌套、函数等，以提升CSS的编写...
详解vue中引入stylus及报错解决方法
08-29
主要介绍了详解vue中引入stylus及报错解决方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
peer webpack@“^5.0.0“ from stylus-loader@6.0.0
Cecilia58的博客
05-23 8936
npm install stylus-loader 在安装包时出错 npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: gshop@1.0.0 npm ERR! Found: webpack@3.12.0 npm ERR! node_modules/webpack npm ERR! dev webpack@"^3.6.0" from
#npm报错#style-loader@3.3.1 requires a peer of webpack@^5.0.0 but none is installed. You must install
老衲的少女心i~
01-18 8926
文章目录前言一、翻译二、解决1.下载目标版本webpack2.读入数据总结 前言 我在项目中想要引入echarts的时候报错： style-loader@3.3.1 requires a peer of webpack@^5.0.0 but none is installed. You must install peer dependencies yourself. 一、翻译 这段话的意思是：style-loader@3.3.1 需要 webpack@^5.0.0 的同级，但没有安装。您必须自己
CentOS7.6 Web项目搭建与测试
kiku
12-23 1326
CentOS7.6 Web项目搭建与测试 CentOS7.6安装Nodejs(Npm) 第一步：软件下载安装 进行安装目录：cd /opt/software (如果目录不存在，请先创建目录) 下载二进制包： wget https://nodejs.org/dist/v10.15.1/node-v10.15.1-linux-x64.tar.xz (下载地址去官网查询最新的，wget命令如果不存在...
loader版本与webpack版本不匹配问题
恰排骨芸豆包嘛的博客
11-04 8693
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: webpack-url-loader@1.0.0 npm ERR! Found: webpack@4.46.0 npm ERR! node_modules/webpack npm ERR! dev webpack@"^4.46.0" from the root project npm .
Vue中使用webpack别名的方法实例详解
08-27
本文主要介绍了Vue中使用webpack别名的方法实例详解，通过实例讲解了在Vue中如何使用webpack别名来简化文件路径引入，提高开发效率。 知识点1：webpack别名的概念 在Vue项目中，经常会遇到长路径的文件引入问题，...
vue 使用Jade模板写html,stylus写css的方法
11-30
本文主要介绍如何在Vue项目中使用Jade作为HTML模板语言，以及使用Stylus作为CSS预处理器。 首先，要启用Jade（现称为Pug）和Stylus，你需要安装相应的依赖包。如果你的项目是通过Vue CLI创建的，那么Stylus已经默认...
node安装依赖常见异常
song854601134的博客
01-10 3892
而npm install xxxx --legacy-peer-deps命令用于绕过peerDependency里依赖的自动安装；它告诉npm忽略项目中引入的各个依赖模块之间依赖相同但版本不同的问题，以npm v3-v6的方式去继续执行安装操作。npm install xxxx --legacy-peer-deps命令与其说是告诉npm要去干什么，不如说是告诉npm不要去干什么。npm install xxxx --legacy-peer-deps命令是什么？为什么可以解决下载时候产生的依赖冲突呢？
npm install报错peerDependencies WARNING eslint-plugin-vue@^5.2.3 requires a peer of eslint@^5.0.0 but
01-07
1、问题场景： npm install 报错，以为是npm问题，改成cnpm install，也还是报错，根据错误信息提示，推断是eslint版本不兼容。 报错提示： peerDependencies WARNING eslint-plugin-vue@^5.2.3 requires a peer of eslint@^5.0.0 but eslint@6.8.0 was installed peerDependencies WARNING eslint-plugin-vue@5.2.3 › vue-eslint-parser@^5.0.0 requires a peer of eslint@
遇到peer webpack@“^5.0.0“ from stylus-loader@6.2.0问题记录
曾小超的博客
10-25 7696
npm install stylus --save npm install stylus-loader --save 执行第二句的时候报错 在package.json文件的devDependencies对象里面加上 "stylus-loader": "^3.0.2", 然后重新执行命令 npm install stylus-loader --save-dev
webpack、sass-loader、npm audit fix、npm audit fix --force兼容性问题
DDJ_TEST的博客
01-12 5898
npm ERR! Found: webpack@3.12.0 npm ERR! node_modules/webpack npm ERR! webpack@"^3.6.0" from the root project npm ERR! Could not resolve dependency: npm ERR! peer webpack@"^4.36.0 || ^5.0.0" from sass-loader@10.1.1 npm ERR! node_modules/sass-loader
vue篇9 常见报错问题解决
bluewelkin的专栏
04-22 2228
vue 常见报错
vscode报错：npm ERR code ERESOLVE npm ERR ERESOLVE unable to resolve dependency tree
VIP_CR的博客
05-12 2567
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: vue-antd-jeecg@3.1.0 npm ERR! Found: webpack@4.46.0 npm ERR! node_modules/webpack npm ERR! dev webpack@“^4.5.0” from the root project npm ERR! .
webpack中css-loader、style-loader的使用
u010234868的专栏
09-20 878
项目目录结构如下： 各文件源码如下： index.html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </h.
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! Found:
weixin_47181907的博客
05-06 3974
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! Found: webpack@5.36.2 npm ERR! node_modules/webpack npm ERR! peer webpack@"^4.0.0 || ^5.0.0" from webpack-dev-middleware@3.7.3 npm ERR! node_modules/webpack-de
用npm安装css-loader和style-loader出错
CodAlun的博客
04-20 5145
错误显示 lenovo@Aiun MINGW64 /f/FrontEnd/Project/aiunmall-fe (aiunmall-v1.0) $ npm install css-loader style-loader --save-dev npm ERR! Windows_NT 10.0.18363 npm ERR! argv "D:\\LearnSoftware\\Node\\node.exe" "D:\\LearnSoftware\\Node\\node_modules\\npm\\bin\\np
vue中安装stylus报错
qq_46580571的博客
05-17 1524
npm ERR! Found: webpack@3.12.0 npm ERR! node_modules/webpack npm ERR! dev webpack@"^3.6.0" from the root project npm ERR! Could not resolve dependency: npm ERR! peer webpack@"^5.0.0" from stylus-loader@6.2.0 npm ERR! node_modules/stylus-loader npm ERR!
vue+electron中在vue文件中使用electron api
最新发布
09-02
在Vue Electron中，在Vue文件中使用Electron API，你需要在Vue组件中引入Electron模块并使用它提供的API。 首先，在你的Vue组件中引入Electron模块，可以使用以下代码： ```javascript const electron = require('...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值