在我的项目中,src/assets/styles文件夹中有一个名为index.scss的文件。在同一级别,有多个文件夹包含最终导入到index. scss的SCSS文件。我想在package.json文件中创建一个脚本,编译所有SCSS文件并将其放置在src/assets/styles/css文件夹中。
“scripts”:{ ...“compile”:“node-sass --watch src/assets/styles/ -o src/assets/css”,}
在我的一个文件中,我包含了normalize库:
第一个月
显示这样的错误:{ "status": 1, "file": "C:/work/flowers-box/node_modules/normalize-scss/sass/normalize/_vertical-rhythm.scss", "line": 15, "column": 17, "message": "Invalid CSS after \"... @return math\": expected expression (e.g. 1px, bold), was \".div($value, $base-\"", "formatted": "Error: Invalid CSS after \"... @return math\": expected expression (e.g. 1px, bold), was \".div($value, $base-\"\n on line 15 of node_modules/normalize-scss/sass/normalize/_vertical-rhythm.scss\n from line 2 of node_modules/normalize-scss/sass/_normalize.scss\n from line 1 of src/assets/styles/common/normalize.scss\n from line 2 of src/assets/styles/index.scss\n>> @return math.div($value, $base-font-size) * 1rem;\n\n ----------------^\n" }
我试着删除这两行,它的工作。我如何使这个文件编译以及,或完全忽略它在编译?
1条答案
按热度按时间stszievb1#
您遇到的错误与规范化库的SCSS文件有关,特别是_vertical-rhythm.scss文件。问题似乎与包含未被SCSS编译器正确解析的mixin或函数的行有关。
要解决这个问题,你有几个选择:
1.从编译中删除标准化文件夹在你的脚本中,你可以修改它以从编译过程中排除标准化文件夹。你可以通过使用--exclude标志和node-sass来做到这一点:
“scripts”:{“compile”:“node-sass --watch src/assets/styles/ --output src/assets/css --exclude src/assets/styles/normalize”}
此修改应防止编译normalize文件夹中的SCSS文件。
1.使用单独的编译过程进行规范化如果您想在项目中包含规范化样式但避免编译问题,请考虑为规范化库创建单独的编译过程。您可以通过创建专门用于规范化的单独SCSS文件,然后将其与主SCSS文件分开编译来实现这一点。
创建一个新的SCSS文件进行规范化(例如,normalize.scss):
字符串
修改编译脚本:
型
单独运行normalize的编译脚本:
型
这种方法允许您将规格化样式与主样式分开处理,从而避免编译期间的潜在冲突。
选择最适合您的项目结构和要求的方法。如果问题仍然存在,您可能还需要检查normalize-scss库的更新或考虑替代的规范化解决方案。