WEGSY85
WEGSY85

Reputation: 291

Parsing error in scss file on build the application

i have an issue. with my React app while i'm building for prod.

./src/styles/main.scss
ParserError: Syntax Error at line: 1, column 25

here's my main.scss file

@import 'vars/typography';
@import 'vars/fonts';
@import 'vars/colors';
@import 'vars/layout';
@import '~bootstrap/scss/bootstrap';
@import 'base.scss';
@import 'components/header';
@import 'components/navigation';
@import 'components/home';
@import 'components/section';
@import 'components/footer';

enter image description here

finally how i import the main.scss into my project

import React from 'react';
import ReactDOM from 'react-dom';
import App from './app/App';
import './styles/main.scss';

ReactDOM.render(
  <React.StrictMode>
      <App />
  </React.StrictMode>,
  document.getElementById('root'),
);

no matter the order i'm putting the imports, i always get the same error. I tried with ./ in front of the import with the same result

Upvotes: 1

Views: 2934

Answers (1)

WEGSY85
WEGSY85

Reputation: 291

Thanks to @dikuw for the answer. To wrap up, I deleted Sass and node-sass and I followed that link for cleaning and rebuilding the whole project.

ERROR in ./src/styles.scss .. Module build failed: Error: Cannot find module 'node-sass'

Upvotes: 1

Related Questions