Topic: SCSS Compile Error on Package

Jean-Philippe Steinmetz free asked 2 years ago

Expected behavior

react-scripts build packages build without error.

Actual behavior

react-scripts build fails with the error:

ParserError: Syntax Error at line: 1, column 26
    at runMicrotasks (<anonymous>)

Resources (screenshots, code snippets etc.)

The contents of app.scss is...

@import '';

The contents of is...

@import '~mdb-react-ui-kit/dist/scss/';

@import '~mdb-react-ui-kit/dist/scss/pro/variables';
@import '~mdb-react-ui-kit/dist/scss/pro/modal';
@import '~mdb-react-ui-kit/dist/scss/pro/perfect-scrollbar';
@import '~mdb-react-ui-kit/dist/scss/pro/sidenav';
@import '~mdb-react-ui-kit/dist/scss/pro/animate';
@import '~mdb-react-ui-kit/dist/scss/pro/lightbox';
@import '~mdb-react-ui-kit/dist/scss/pro/rating';
@import '~mdb-react-ui-kit/dist/scss/pro/timepicker';
@import '~mdb-react-ui-kit/dist/scss/pro/navbar';
@import '~mdb-react-ui-kit/dist/scss/pro/datepicker';
@import '~mdb-react-ui-kit/dist/scss/pro/popconfirm';
@import '~mdb-react-ui-kit/dist/scss/pro/datatable';
@import '~mdb-react-ui-kit/dist/scss/pro/stepper';
@import '~mdb-react-ui-kit/dist/scss/pro/sticky';
@import '~mdb-react-ui-kit/dist/scss/pro/select';
@import '~mdb-react-ui-kit/dist/scss/pro/loading';
@import '~mdb-react-ui-kit/dist/scss/pro/autocomplete';
@import '~mdb-react-ui-kit/dist/scss/pro/theme/theming';
@import '~mdb-react-ui-kit/dist/scss/pro/chips';
@import '~mdb-react-ui-kit/dist/scss/pro/multi-range';
@import '~mdb-react-ui-kit/dist/scss/pro/date-time-picker';

Additional Notes:

  1. Using react-scripts start runs without issues.
  2. Removing the @import '' line fixes the build.
  3. Commenting out the entire contents of also fixes the build.
  4. Reducing to just the first line repro's the broken behavior.

Krzysztof Wilk staff commented 2 years ago

We are working on fixing this issue. The fix should appear in about 1-2 weeks. For now, you can use one of the solutions provided here: I'm sorry for that :(

Jean-Philippe Steinmetz free commented 2 years ago

The workaround appears to only be for npm based installs but we use yarn. Is there a workaround for those of us using yarn?

Jean-Philippe Steinmetz free commented 2 years ago

It looks like just adding 'resolutions' to my package file was enough to fix the problem using yarn. Thanks. I look forward to the real fix! :)

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB React
  • MDB Version: MDB5 1.3.0
  • Device: All
  • Browser: All
  • OS: All
  • Provided sample code: Yes
  • Provided link: No