如何修复 .css 文件的编译问题答案

【问题标题】：How to fix compiling problems with .css file如何修复 .css 文件的编译问题
【发布时间】：2019-05-08 03:46:30
【问题描述】：

我目前正在学习使用 .scss 但已决定改用 .css 的教程。当我按照教程进行操作时，我尝试写入 .css 文件，但遇到了一些编译问题。

我对 .css 不太熟悉，所以我很难修复它们。我不确定问题是否在于某些语法是 scss 独有的。问题主要出在property-list-item.component.css和Property-list.component.css。

https://github.com/zhadjah9559/Wholesale-cli.git

错误：

./src/app/property/Property-list-item/property-list-item.component.css 中的错误

模块构建失败：错误：无法解析“C:\Users\zach\College\Spring 2019\Senior Proj\Wholesale-cli\src\app\property\Property-list-item”中的“变量”

在 doResolve (C:\Users\zach\College\Spring 2019\Senior Proj\Wholesale-cli\node_modules\enhanced-resolve\lib\Resolver.js:180:19)

Pic1

pic 2

另外，有人知道如何卸载扩展程序吗？我相信我在可视代码中使用的其中一个 css 格式化程序扩展可能有问题。

更新

@import 'variables';
a 6:hover,
a 6:focus {
    text-decoration: none;
}

.bsp-card {
    border: none;
}

.bsp-card .card-block {
    padding-top: 8px;
}

.bsp-card .card-subtitle {
    margin: 0px;
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
    color: #16861a;
}

.bsp-card .card-title {
    font-size: 19px;
    margin: 3px 0;
}

.bsp-card .card-text {
    font-size: 14px;
    font-weight: 300;
    color: #7e7e7e;
    margin-bottom: 0;
}

【问题讨论】：

你遇到了什么错误？
你不能在 CSS 中使用 SCSS 语法。
你的样式结构是scss，你的文件是.css，你要么需要把它分解成css结构，要么你需要安装scss并将你的文件重命名为.scss。
既然你 @import 变量，这绝对是 scss 方式尝试安装 scss 并将文件重命名为 .scss 或者你可以使用 scss 作为默认预处理器运行命令（如 ng new Your-Project --style scss）创建一个新项目，这将创建一个 cli 应用程序默认使用 scss 预处理器和文件

标签： css angular debugging sass

【解决方案1】：

当你生成一个新项目时，你需要像这样在生成时选择 CSS

【讨论】：

【解决方案2】：

您的 CSS 文件正在尝试导入一个不存在的变量 scss 文件。

@import '变量';

删除它，但确保没有对 css 文件中的变量的引用。

【讨论】：