TS2416: La propiedad '_up' en el tipo 'PropertyStack' no se puede asignar a la misma propiedad en el tipo base 'PropertyComposite<PropertyStackProps>'
Copié algunos ajustes de tsconfig de un proyecto gjs de vite que funcionaba a mi proyecto stenciljs y ahora funciona correctamente. Creo que necesitas hacer algunos ajustes en tu tsconfig de Angular y ya no debería mostrar el error A continuación está mi stenciljs tsconfig de trabajo: Parece ser lo que permite la comp...
Lee la respuesta completa abajo ↓Pregunta
Versión GrapesJS
- Confirmo que se debe usar la última versión de GrapesJS
¿Qué navegador usas?
Enlace de demo reproducible
https://codesandbox.io/p/sandbox/pensive-browser-mfhxp8
Describe el bicho
¿Cómo reproducir el bicho?
- Crear Proyecto Angular
- Añadir dependencia de grapeJS
- incluye 'allowSyntheticDefaultImports": true' en tsconfig (para backbone)
- Crear componente envoltorio para GrapeJS
importar { Component, OnInit } de '@angular/core';
importar uvas de 'uvas';
@Component({
Selector: 'App-editor',
plantilla: '< id de div="miCompositor"></div>',
styleUrls: ['./editor.component.css'],
})
export class EditorComponent implementa OnInit {
constructor() {}
ngOnInit(): void {
this.loadGrapesJS();
}
private loadGrapesJS() {
console.log('cargaGrapesJS');
grapesjs.init({
Contenedor: '#myComposer',
});
}
}
- Utiliza el componente wrapper en el proyecto
<app-editor></app-editor>
¿Cuál es el comportamiento esperado?
Render GrapeJS Editor
¿Cuál es el comportamiento actual?
Roto en la Build
Compilación en: 2023-05-31T14:41:40.309Z - Hash: dc2896192a7f20df - Tiempo: 11178ms
Aviso: /workspace/src/app/editor/editor.component.ts depende de 'grapesjs'. Las dependencias de CommonJS o AMD pueden provocar rescates de optimización.
Para más información, consulta: https://angular.io/guide/build#configuring-commonjs-dependencies
Error: node_modules/grapesjs/dist/index.d.ts:7601:2 - error TS2416: La propiedad '_up' en el tipo 'PropertyStack' no se puede asignar a la misma propiedad en el tipo base 'PropertyComposite<PropertyStackProps>'.
El tipo '(props: Partial<PropertyStackProps>, opts?: OptionsUpdate | indefinido) => this' no se puede asignar al tipo '(props: Partial<PropertyCompositeProps>, opts?: OptionsUpdate | indefined) => this'.
Los tipos de parámetros 'props' y 'props' son incompatibles.
El tipo 'Parcial<PropertyCompositeProps>' no se puede asignar al tipo 'Parcial<PropertyStackProps>'.
Los tipos de propiedades 'fromStyle' son incompatibles.
Tipo 'FromStyle | undefined' no se puede asignar al tipo '((style: StyleProps, data: FromStyleDataStack) => PropValues) | indefinido'.
7601 _up(utilería: ¿Parcial<PropertyStackProps>, opts?: OptionsUpdate): esto;
~~~
Código de conducta
- Acepto seguir el Código de Conducta de este proyecto
Respuestas (4)
Copié algunos ajustes de tsconfig de un proyecto gjs de vite que funcionaba a mi proyecto stenciljs y ahora funciona correctamente. Creo que necesitas hacer algunos ajustes en tu tsconfig de Angular y ya no debería mostrar el error
A continuación está mi stenciljs tsconfig de trabajo:
{
"compilerOptions": {
"forceConsistentCasingInFileNames": cierto,
"allowSyntheticDefaultImports": cierto,
"allowUnreachableCode": falso,
"declaración": falsa,
"Decoradores experimentales": cierto,
"lib": ["dom", "es2021", "DOM. Iterable"],
"skipLibCheck": cierto,
"strictNullChecks": falso,
"moduleResolution": "nodenext",
"módulo": "esnext",
"Objetivo": "ES2021",
"noUnusedLocals": cierto,
"noUnusedParameters": cierto,
"jsx": "react",
"jsxFactory": "h"
},
"incluir": [
"SRC"
],
"excluir": [
"node_modules"
]
}
"skipLibCheck": cierto,
"strictNullChecks": falso,
Parece ser lo que permite la compilación
"skipLibCheck": cierto,
"SkipLibCheck": verdadero "'' funcionó. ¡Gracias@marktamis 👍
Sí, aquí es necesario 'skipLibCheck": true' hasta que encuentre la solución para esa salida 😞 TS
Gracias por informar de esto, @jmtt89.
Los problemas de seguridad y dependencias son importantes. El equipo de GrapesJS trabaja activamente para mantener las dependencias actualizadas.
Para ti ahora mismo:
- Ejecutar 'npm audit fix' para ver los parches disponibles
- Busca una versión más reciente de GrapesJS que ya haya solucionado esto
- Si está disponible, prueba la última versión estable antes de actualizar
- Si la vulnerabilidad es crítica, 'npm audit fix ---force' es una opción, pero prueba a fondo
Entendiendo el riesgo:
- Revisar los detalles específicos de vulnerabilidades en los Avisos de Seguridad de GitHub
- No todos los problemas de alta gravedad afectan a tu ruta de código
- Algunas vulnerabilidades solo se activan bajo condiciones específicas
Manteniéndome al día:
- Atentos a nuevos lanzamientos de GrapesJS
- Suscribirse a las notificaciones de seguridad en el repositorio
- El equipo prioriza las actualizaciones de seguridad en su ciclo de lanzamiento
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #4854
exportar 'default' no se encuentra en 'backbone' (el módulo no tiene exportaciones)
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Firefox 109 Enlace de demo reproducible n...
Issue #4851
this.on('change:attributes:type', this.handleTypeChange) no soportan tipo de array
Versión GrapesJS[X] Confirmo que se debe usar la última versión de GrapesJS¿Qué navegador usas? Chrome 108.0.5359.125Enlace de demo reprodu...
Issue #4573
ParseStyle no es una función
Versión GrapesJS[X] Confirmo que se debe usar la última versión de GrapesJS¿Qué navegador usas? Firefox 104.0.1Enlace de demo reproducible...
Issue #4572
El evento de actualización de página no se activa
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome Enlace de demo reproducible https:...
Plugins de pago que cumplen con este problema
Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.
Cargando recomendaciones de plugins de pago...
Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.
Explora plugins gratuitos →Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.
Explora plugins premium →Tutoriales relacionados
Guías detalladas sobre el mismo tema.
Tutorial
Ship to Production Faster: What’s New in GrapesJS Shadcn
Supercharge your page builder! GrapesJS Shadcn adds live drag previews, rich text / commands, dynamic data, and canvas presets to ship to prod faster.
Tutorial
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
Tutorial
GrapesJS Inline RTE Plugins Update: CKEditor 5 v0.1.4 and Froala Inline Text Editor
CKEditor 5 Inline for GrapesJS v0.1.4 fixes Studio SDK toolbar clipping, iframe injection and link balloon bugs. Compare with Froala Inline — both $69.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.