BUG: Error importing codemirror library in SCSS
Question
GrapesJS version
- I confirm to use the latest version of GrapesJS
What browser are you using?
Firefox 112.0.1
Reproducible demo link
https://github.com/davidrhoderick/grapesjs-test
Describe the bug
How to reproduce the bug?
- Follow getting started (you can see the structure I am following with a basic Parcel project with Typescript & SCSS)
- When you get to the "Theming" step, you'll get an error trying to import Grapes SCSS.
What is the expected behavior? That if I follow the "Getting started" tutorial, everything works.
What is the current behavior? When I get to the step that should allow me to customize the appearance of the application with SCSS, I get the following error:
@parcel/transformer-sass: expected "{".
╷
11 │ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
│ ^
╵
node_modules/codemirror/lib/codemirror.js 11:48 @import
node_modules/grapesjs/src/styles/scss/main.scss 2:9 @import
src/styles.scss 10:9 @import
src/index.html 2:15 root stylesheet
If is necessary to execute some code in order to reproduce the bug, paste it here below:
npm run dev
Code of Conduct
- I agree to follow this project's Code of Conduct
Answers (2)
Funnily enough, the CSS-based styling works.
Looks like the Parcel transformer is trying to import codemirror/lib/codemirror.js instead of codemirror/lib/codemirror.css on this line:
@import "codemirror/lib/codemirror";
So I'd suggest to open the issue on the related package
Related Questions and Answers
Continue research with similar issue discussions.
Issue #6211
BUG: Too much recursion
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 131.0.2 Reproducible demo link htt...
Issue #5746
BUG: ColorPicker Offset incorrect when Panels are outside of Editor Container
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v122 Reproducible demo link https:/...
Issue #5079
BUG: Crash when dragging into nested components with Vue+Vite.
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 112.0.2 (64-Bit) Reproducible demo...
Issue #4191
BUG: We are trying to store the data from grapesJS editor in Angular 10 application, getting CORS error, image attached below
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 99.0.4844.5 Reproducible demo link...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.