BUG: TS2416: Property '_up' in type 'PropertyStack' is not assignable to the same property in base type 'PropertyComposite<PropertyStackProps>'

[jmtt89]

GrapesJS version

• [X] I confirm to use the latest version of GrapesJS

What browser are you using?

---

Reproducible demo link

https://codesandbox.io/p/sandbox/pensive-browser-mfhxp8

Describe the bug

How to reproduce the bug?

1. Create Angular Project
2. Add grapeJS dependency
3. include "allowSyntheticDefaultImports": true on tsconfig (for backbone)
4. Create wrapper component for GrapeJS

   
   import { Component, OnInit } from '@angular/core';
   import grapesjs from 'grapesjs';

@Component({ selector: 'app-editor', template: '

', styleUrls: ['./editor.component.css'], }) export class EditorComponent implements OnInit { constructor() {}

ngOnInit(): void { this.loadGrapesJS(); }

private loadGrapesJS() { console.log('loadGrapesJS'); grapesjs.init({ container: '#myComposer', }); } }

6. Use the wrapper component on the project

## **What is the expected behavior?**
Render GrapeJS Editor

## **What is the current behavior?**
Broken on Build

Build at: 2023-05-31T14:41:40.309Z - Hash: dc2896192a7f20df - Time: 11178ms

Warning: /workspace/src/app/editor/editor.component.ts depends on 'grapesjs'. CommonJS or AMD dependencies can cause optimization bailouts. For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Error: node_modules/grapesjs/dist/index.d.ts:7601:2 - error TS2416: Property '_up' in type 'PropertyStack' is not assignable to the same property in base type 'PropertyComposite'. Type '(props: Partial, opts?: OptionsUpdate | undefined) => this' is not assignable to type '(props: Partial, opts?: OptionsUpdate | undefined) => this'. Types of parameters 'props' and 'props' are incompatible. Type 'Partial' is not assignable to type 'Partial'. Types of property 'fromStyle' are incompatible. Type 'FromStyle | undefined' is not assignable to type '((style: StyleProps, data: FromStyleDataStack) => PropValues) | undefined'.

7601 _up(props: Partial, opts?: OptionsUpdate): this;

```

### Code of Conduct

- [X] I agree to follow this project's Code of Conduct

[sfreed]

Getting Same Error

[Deepakanandrao]

+1

[marktamis]

+1

[marktamis]

I copied over some of the settings of the tsconfig from a working vite gjs project into my stenciljs project and now it is running correctly. I think you need to do some tweaking to your angular tsconfig and it should not throw the error anymore

below is my working stenciljs tsconfig:

{
  "compilerOptions": {
    "forceConsistentCasingInFileNames": true,
    "allowSyntheticDefaultImports": true,
    "allowUnreachableCode": false,
    "declaration": false,
    "experimentalDecorators": true,
    "lib": ["dom", "es2021", "DOM.Iterable"],
    "skipLibCheck": true,
    "strictNullChecks": false,
    "moduleResolution": "nodenext",
    "module": "esnext",
    "target": "es2021",
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "jsx": "react",
    "jsxFactory": "h"
  },
  "include": [
    "src"
  ],
  "exclude": [
      "node_modules"
  ]
}

    "skipLibCheck": true,
    "strictNullChecks": false,

seems to be what allows the compilation

[Deepakanandrao]

"skipLibCheck": true,

"skipLibCheck": true did the trick. Thank you @marktamis 👍

[artf]

Yeah "skipLibCheck": true is necessary here until I find the fix for that TS output 😞

[jmtt89]

Thanks!!!