简单记录下Vue3 如何使用stylus
开发环境: vue-cli5一键生成的Vue+TS全家桶
需求:如下图,有一个 variable.module.styl 文件定义了全局样式,需要让它可以在各个.vue文件<style>中被调用,同时可以输出变量被 ts(js) 直接调用

1. 用style-resource把styl文件暴露到全局

2. 外部.styl 文件,如果想导出变量供Vue文件使用,可以使用:export ,但是导出来的结果打印是空obj,需要将xx.styl文件名改为xxx.module.styl,我查了下是因为webpack约定形如 aaa.module.xxx的样式文件,会被识别为css module从而开启识别 :export



网友评论