stylus 问题

mac系统，只要加上stylus的style，系统就报错。删除就ok

代码检查了2遍了，都是跟着老师敲的。肯定是stylus的样式问题，如何解决呢？

源自：项目-首页开发 2-1 Vue项目首页 - header区域开发

收起

3回答

好帮手慕星星 2021-03-10 09:43:14

同学你好，vscode中没有关于stylus语法的格式化插件。如果同学安装了其他格式化插件，可能会有影响。建议先将其他格式化插件禁用掉，然后手动去写stylus代码。

祝学习愉快！

好帮手慕星星 2021-03-09 19:17:32

同学你好，从截图中看到.header的样式需要往后缩一个tab才正确

建议修改测试下。

另外stylus的版本课程中为

建议保持一致，如果不是这个版本的话，建议安装指定版本

npm install --save stylus@0.54.5

如果还是不可以的话，建议将自己写的vue页面代码粘贴上来，不要截图，便于帮助测试解决。

祝学习愉快！

提问者慕粉1473597318 #1

老师，我查了下json里面的版本号，已经降级到老师的版本了。
如下：
"dependencies": {
"fastclick": "^1.0.6",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.1",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
},

还是stylus的问题，我尝试删除了所有样式，vue可以运行，但是一旦贴入样式。就报错。

<template>
<div class = "header">
<div class = "header-left">返回</div>
<div class = "header-input">内容</div>
<div class = "header-right">城市</div>
</div>
</template>

<script>
export default {
name: 'HomeHeader'
}
</script>

<style lang="stylus" scoped>
.header
display : flex
height: .86rem
.header-left
width: .64rem
float:left
.hearder-input
flex:1
.header-right
width: 1.24rem
float:right
</style>

2021-03-09 19:32:32
提问者慕粉1473597318 #2

老师，bug找到了，还是stylus的样式问题，vscode有fomat吗？就是stylus的format，每次写完，让系统自动调整一下样式，免得莫名其妙报错。

2021-03-09 19:39:12