Andy Tran leepfrog

Ember 5.1 project blueprint and built-in types

TLDR

The Issue

These are the steps I took to setup Ember 5.1, Embroider, TypeScript, & built in ember-source Types. In the end, I am stuck on a specific error message that I am currently working to resolve:

$ ember serve
WARNING: Ember CLI v5.1.0 is not tested against Node v20.3.1. See "https://github.com/ember-cli/ember-cli/blob/master/docs/node-support.md" to find out which version of Node is best to use.
node_modules/.pnpm/@[email protected]/node_modules/@glimmer/validator/dist/types/lib/validators.d.ts:78:45 - error TS2422: A class can only implement an object type or intersection of object types with statically known members.

	import { http, HttpHandler, HttpResponse } from 'msw';
	import db from './db';
	import {
	jsonApiIndexDocument,
	jsonApiShowDocument,
	jsonApiResource,
	jsonApiResponseHeaders,
	} from 'my-app/mocks/jsonapi';
	import { getObjectsByKeypath } from 'my-app/mocks/utils';
	import { pluralize } from 'ember-inflector';

	// Change 0: Add book(0)
	// Change 1: Add book-category and assign to book(0)
	// Change 2: Remove category-tag from book(1).category-tag(0)
	// Change 3: Update title on book(1)
	{
	"atomic:operations": [
	{
	"data": {
	"attributes": {
	"name": "untitled"

	import Model, { attr } from '@ember-data/model';

	export default class Book extends Model {
	@attr('string')
	declare name: string;

	declare id: string;
	}

	// Type definitions for QUnit v2.0.1
	// Project: http://qunitjs.com/
	// Definitions by: James Bracy <https://github.com/waratuman>
	// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped

	interface Assert {
	/**
	* Instruct QUnit to wait for an asynchronous operation.
	*
	* The callback returned from `assert.async()` will throw an Error if it is

	> npm ls broccoli-persistent-filter
	[email protected] <path>\myproj
	`-- [email protected]
	`-- [email protected]

	>npm ls async-disk-cache
	[email protected] <path>\myproj
	`-- [email protected]
	`-- [email protected]
	`-- [email protected]

	import Ember from 'ember';

	export default Ember.Controller.extend({
	appName: 'Ember Twiddle',
	actions: {
	save() {
	const book = this.store.createRecord('book');
	book.save();

	const book2 = this.store.createRecord('book', { duplicatedBook: book });

	import Ember from 'ember';

	export default Ember.Component.extend({
	tagName: 'form',
	submit(event) {
	event.preventDefault();
	console.log(this.$().serializeArray());
	}
	});

	class Author < ActiveRecord::Base
	has_one :history, as: :related
	end

	class History < ActiveRecord::Base
	belongs_to :related, polymorphic: true

	validates :related_id, presence: true, uniqueness: {scope: :related_type}
	validates :related_type, presence: true, uniqueness: true
	end