当前位置: 首页 > Web前端 > vue.js

Nuxt的scss预编译器

时间:2023-03-31 17:24:21 vue.js

div{color:red;}的使用方法在之前的文章中写过,在网上看了一堆文章。坑的一塌糊涂,最后也没搞明白。参考官方文档终于弄明白了。官方文档:https://www.nuxtjs.cn/faq/pre...以下是我自己想出来的步骤:第1步修改package.json文件:很奇怪,12.1版本直接安装没有版本号。0使用时经常出错。网上很多文章也说是版本太高了。我一直在用这个版本,感觉不错。“依赖项”:{“@nuxtjs/style-resources”:“^1.2.1”,“core-js”:“^3.15.1”,“element-ui”:“^2.15.2”,“nuxt”:"^2.15.7"},"devDependencies":{"node-sass":"^4.12.0","sass-loader":"^7.1.0"}也就是说,也应该放在这里,你可以试试Try"dependencies":{"@nuxtjs/style-resources":"^1.2.1","core-js":"^3.15.1","element-ui":"^2.15.2","nuxt":"^2.15.7","node-sass":"^4.12.0","sass-loader":"^7.1.0"},"devDependencies":{}第二步修改nuxt.config.js的css数组如下://全局CSS:https://go.nuxtjs.dev/config-csscss:['element-ui/lib/theme-chalk/index.css',//是这个饥饿的?对于组件库,不用管//下面两个是scss使用的//直接加载一个Node.js模块。(这里是一个Sass文件)//CSS文件'@/assets/css/main.css'要在项目中使用,//SCSS文件'@/assets/css/main.scss'要在项目中使用project],Step3创建assets目录和css目录,并新建一个空文件夹Step4在style中添加一些东西就可以使用了div{color:red;}