En los últimos años, nos hemos alejado de la sintaxis heredada .extend({ ... }) de Ember y nos hemos dirigido hacia la sintaxis de clases nativas como class extends Foo {...}.
Si bien la sintaxis heredada todavía es técnicamente compatible, las herramientas modernas de JavaScript, incluidos los IDE y Prettier 3.0, no admiten decoradores en las sintaxis heredadas basadas en literales de objetos. En la última versión de nuestra configuración de linting recomendada, verá estos errores al usar la sintaxis heredada:
ESLint: error Se deben usar clases nativas de JS en lugar de clases clásicas ember/no-classic-classes
Prettier: SyntaxError: Los decoradores no se pueden usar para decorar propiedades de literales de objetos
Por lo tanto, si aún no lo ha hecho, es hora de actualizar el código de su tema y complemento a la nueva sintaxis. Hay dos cosas principales que actualizar: nuevas definiciones de clase y llamadas a modifyClass.
Definiciones de clase
Gran parte del trabajo se puede realizar utilizando ember-native-class-codemod. Desde dentro de su repositorio de temas/complementos, ejecute:
NO_TELEMETRY=true npx ember-native-class-codemod@4.1.1 --no-classic-decorator **/*.js
Esto recorrerá sus archivos y los transformará a la nueva sintaxis de clases nativas. A veces, le pedirá que intervenga manualmente. Siempre revise los cambios de código que realiza; no es perfecto.
Si tiene muchos temas/complementos para actualizar, puede estar interesado en nuestro script de PR masivo.
Llamadas a modifyClass
Si utiliza decoradores dentro de las llamadas a modifyClass, deberá utilizar la nueva sintaxis basada en clases nativas. Para obtener más información al respecto, consulte la documentación. Al realizar estos cambios, tenga en cuenta las limitaciones documentadas.