问题：ParserError：第 1 行第 32 列

如何解决问题：ParserError：第 1 行第 32 列

我是编程新手，遇到了这个问题。 当我在终端中输入“npm run build”以在 React.js 中创建我的项目的压缩时，出现此错误。我已经创建了另一个以前的项目，它没有这个问题，我不知道有什么区别。

问题：

Creating an optimized production build...
Failed to compile.

./src/Styles/intro.css
ParserError: Syntax Error at line: 1,column 32

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! webblasyxnew@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the webblasyxnew@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/Iwona/.npm/_logs/2020-12-18T21_38_01_153Z-debug.log

我的 Json：

    {
  "name": "webblasyxnew","version": "0.1.0","private": true,"dependencies": {
    "@testing-library/jest-dom": "^5.11.6","@testing-library/react": "^11.2.2","@testing-library/user-event": "^12.6.0","react": "^17.0.1","react-dom": "^17.0.1","react-scripts": "4.0.1","web-vitals": "^0.2.4"
  },"homepage": "https://blasyx.com/","scripts": {
    "predeploy": "npm run build","deploy": "gh-pages -d build","start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"
  },"eslintConfig": {
    "extends": [
      "react-app","react-app/jest"
    ]
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  }
}

///////////////////

可能是因为我使用了 Css 变量？也许有些东西我没有验证。 我的 intro.css ->

@font-face{
        font-family: 'anodina';
        src: url('../Fonts/Anodina-Regular.otf');
}

.intro__header,.intro__hover__title,.intro__click__title,.intro__end__text {
    font-family: 'Anonymous Pro';
    font-weight: 400;
    pointer-events: none; 
}
.intro__o{
    pointer-events: none; 
}

.intro__hover__text,.intro__hover__text{
    font-family: 'anodina';
}

.intro{
    position: relative;
    padding-top: 8rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    height: 100vh;
    background-color: var(--clr-cyan);
}


.intro__header{

    width: min(800px,90%);
    padding: 3rem;
    margin-bottom: 8rem;
    font-size: .75rem;
    text-align: center;
    border: 1px var(--clr-black) solid;
    Box-shadow: var(--clr-black) calc(var(--x)/-20) calc(var(--y)/20);
    background-color: var(--clr-yellow);
}

.intro__info{
    width: min(800px,90%);
    display: grid;
    grid-template-columns: 35% 1fr 35%;
    grid-template-areas: "intro__hover . intro__click";
}


.intro__hover,.intro__click,.intro__o{
    height: 25vh;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin-bottom: 7rem;

}
.intro__click__text,.intro__hover__text{
    position: absolute;
    text-align: center;
    width: 80%;
    font-family: 'anodina';
    color: var(--clr-white);
    opacity: 0;

}

.intro__hover,.intro__click{
    background-color: var(--clr-white);
    Box-shadow: var(--clr-black) calc(var(--x)/-20) calc(var(--y)/-20);
    border: 1px var(--clr-black) solid; 
    cursor: pointer;
}

.intro__end__text{
    margin-bottom: 5rem;
}

.hideBox__intro{
    background-color: var(--clr-black);
    Box-shadow: var(--clr-white) calc(var(--x)/-20) calc(var(--y)/-20);
    transition: all 300ms;
}
.showtext__intro{
    opacity: 1;
}
.hidetext__intro{
    opacity: 0;
}
#intro__hello{
    opacity: 0;
    pointer-events: none; 
}

我的 JSON 的第 14 行和第 15 行之间还有 DEBUGGER 这个词。 这是正常的还是我有问题？ 就在脚本之前。

谢谢！ 布拉斯。