首页 > 其他分享 >React后台管理系统 04 配置路径别名、全局样式设置、模块化scss

React后台管理系统 04 配置路径别名、全局样式设置、模块化scss

时间:2022-12-05 16:44:51浏览次数:49  
标签:scss 04 样式 模块化 ts React 引入 全局

ts中对于@符号指定的路径不支持,同时vite中也是不支持的,所以我们需要在vite.config.ts中进行指定配置,path是node中自带的一个模块这里爆红的原因是没有进行声明:

我们使用命令对path进行单独的声明之后就不会爆红了。

这样我们在引入的时候就可以直接使用@符号来代替点号了:

我们如果想在使用@符号的时候后面有提示的话,那么就需要在ts.config.json中进行配置如下参数:

这样就有提示了。

模块化样式的引入方式,这样可以不会影响到全局的样式:

我们创建文件全局样式,指定了body的颜色和禁用文字选中,还有图片禁止拖动。

创建2个组件Comp1和Comp2,并且引入样式,使用模块化的方式对scss文件进行重新命名,并且引入然后下面 classname就可以使用对象.的方式进行样式的赋值。

当然,我们还需要在App.tsx中进行引入,才会使组件生效。

标签:scss,04,样式,模块化,ts,React,引入,全局
From: https://www.cnblogs.com/hg-blogs/p/16952727.html

相关文章