embroider-build / app-blueprint Goto Github PK

[pre-alpha™️] Blueprint for next generation of Ember apps

JavaScript 83.01% HTML 13.20% TypeScript 1.31% CSS 1.08% Handlebars 1.40%

app-blueprint's Introduction

@embroider/app-blueprint

Very experimental blueprint for scaffolding Ember v2 apps with Vite

Caution

This blueprint is not intended for production or development use. There are a number of known issues that we are working on, and it is intended as a technology preview only. Do not use this blueprint unless you know what you are doing!

If you want to use Embroider in a production application follow the instructions on the main Embroider README.

This is likely to change on a daily basis so you have to keep up to date with the changes to expect it work. Use ember-cli-update to update to the latest version.

Usage

Generating a brand new app

This following command will create a new folder called my-fancy-app in your cwd

npx ember-cli@latest new my-fancy-app -b @embroider/app-blueprint --pnpm

Updating an existing Ember app

If you want to try to update an existing app you can run this command inside your app's directory:

pnpx ember-cli@latest init -b @embroider/app-blueprint --pnpm --name your-app-name

it will prompt you to override some files and you should say yes to every override.

Note: replace your-app-name with your existing app name (from the package.json file) for a smaller diff.

Updating the blueprint version

Use ember-cli-update to update to later versions of the blueprint:

pnpx ember-cli-update

app-blueprint's People

Contributors

Stargazers

Watchers

Forkers

ignacemaes aklkv amauryd aalimovs

app-blueprint's Issues

Add `tmp` to gitignore

Embroider is emitting a local tmp now (to work around vite problems that we will have until we eliminate all app rewriting). It should go into the blueprint's gitignore.

Additional flags are not included in the ember-cli-update.json

command:

❯ npx ember-cli@latest new my-fancy-app -b @embroider/app-blueprint --pnpm --ci-provider none --no-welcome

output ember-cli-update.json

{
  schemaVersion: "1.0.0",
  packages: [
    {
      name: "@embroider/app-blueprint",
      version: "0.3.0",
      blueprints: [
        {
          name: "@embroider/app-blueprint",
          isBaseBlueprint: true,
          options: ["--package-manager pnpm"],
        },
      ],
    },
  ],
}

qunit-dom is too old, v3 is a v2 addon

current blueprint ships with qunit-dom v2

Specifying `--name` when generating a new project errors

Not sure if this is intended to be supported, but I saw --name used in the init instructions in the README`. The intent was to generate the project in one folder, and then just have the module name be "app", for brevity.

npx ember-cli@beta new web-client \
  --blueprint @embroider/app-blueprint \
  --typescript \
  --pnpm \
  --skip-git \
  --skip-npm \
  --name app # <---- this part here

output:

The option '--name' is not registered with the 'new' command. Run `ember new --help` for a list of supported options.
installing app-blueprint
installing app
Ember CLI v5.9.0

✨  Creating a new Ember app in <cwd>/web-client:
The globPattern "app" did not match any files, so no file updates will be made.
The globPattern "app" did not match any files, so no file updates will be made.
ENOENT: no such file or directory, open '<cwd>/web-client/package.json'


Stack Trace and Error Report: /tmp/error.dump.4c06251c7656eaf1d261a6a8a480be59.log

=================================================================================

ENV Summary:

  TIME: Sun Jul 07 2024 12:36:35 GMT-0400 (Eastern Daylight Time)
  TITLE: ember
  ARGV:
  - 🏠/.volta/tools/image/node/22.3.0/bin/node
  - 🏠/.npm/_npx/51048be46e5ecfec/node_modules/.bin/ember
  - new
  - web-client
  - --blueprint
  - @embroider/app-blueprint
  - --typescript
  - --pnpm
  - --skip-git
  - --skip-npm
  - --name
  - app
  EXEC_PATH: 🏠/.volta/tools/image/node/22.3.0/bin/node
  TMPDIR: /tmp
  SHELL: /bin/bash
  PATH:
  - 🏠/.npm/_npx/51048be46e5ecfec/node_modules/.bin
  - <repo>/node_modules/.bin
  - /✂️/node_modules/.bin
  - /✂️/node_modules/.bin
  - 🏠/node_modules/.bin
  - /home/node_modules/.bin
  - /node_modules/.bin
  - 🏠/.volta/tools/image/node/22.3.0/lib/node_modules/npm/node_modules/@npmcli/run-script/lib/node-gyp-bin
  - 🏠/.volta/tools/image/pnpm/9.3.0/bin
  - 🏠/.volta/tools/image/yarn/1.22.21/bin
  - 🏠/.volta/tools/image/node/22.3.0/bin
  - 🏠/.bun/bin
  - 🏠/.bun/bin
  - 🏠/.volta/bin
  - 🏠/.cargo/bin
  - 🏠/Applications
  - 🏠/apps/phantomjs/bin
  - 🏠/scripts/system-utils
  - 🏠/scripts/node
  - 🏠/scripts/git
  - 🏠/scripts/rails
  - 🏠/scripts
  - 🏠/.bun/bin
  - 🏠/.bun/bin
  - 🏠/.volta/bin
  - 🏠/.cargo/bin
  - 🏠/.cargo/bin
  - 🏠/Applications
  - 🏠/apps/phantomjs/bin
  - 🏠/scripts/system-utils
  - 🏠/scripts/node
  - 🏠/scripts/git
  - 🏠/scripts/rails
  - 🏠/scripts
  - /usr/local/sbin
  - /usr/local/bin
  - /usr/sbin
  - /usr/bin
  - /sbin
  - /bin
  - /usr/games
  - /usr/local/games
  - /snap/bin
  - /snap/bin
  PLATFORM: linux x64
  FREEMEM: 51850383360
  TOTALMEM: 65106300928
  UPTIME: 441048.67
  LOADAVG: 0.69,0.43,0.39
  CPUS:
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 3501
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 400
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4229
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 2871
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4624
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 2290
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4623
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4652
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4693
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4689
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 4690
  - AMD Ryzen 5 7640U w/ Radeon 760M Graphics - 1927
  ENDIANNESS: LE
  VERSIONS:
  - acorn: 8.11.3
  - ada: 2.8.0
  - ares: 1.29.0
  - base64: 0.5.2
  - brotli: 1.1.0
  - cjs_module_lexer: 1.2.2
  - cldr: 45.0
  - icu: 75.1
  - llhttp: 9.2.1
  - modules: 127
  - napi: 9
  - nghttp2: 1.62.1
  - nghttp3: 0.7.0
  - ngtcp2: 1.3.0
  - node: 22.3.0
  - openssl: 3.0.13+quic
  - simdjson: 3.9.3
  - simdutf: 5.2.8
  - tz: 2024a
  - undici: 6.18.2
  - unicode: 15.1
  - uv: 1.48.0
  - uvwasi: 0.0.21
  - v8: 12.4.254.20-node.13
  - zlib: 1.3.0.1-motley-4f653ff

ERROR Summary:

  - broccoliBuilderErrorStack: [undefined]
  - code: ENOENT
  - codeFrame: [undefined]
  - errorMessage: ENOENT: no such file or directory, open '<repo>/web-client/package.json'
  - errorType: [undefined]
  - location:
    - column: [undefined]
    - file: [undefined]
    - line: [undefined]
  - message: ENOENT: no such file or directory, open '<repo>/web-client/package.json'
  - name: Error
  - nodeAnnotation: [undefined]
  - nodeName: [undefined]
  - originalErrorMessage: [undefined]
  - stack: Error: ENOENT: no such file or directory, open '<repo>/web-client/package.json'
    at Object.openSync (node:fs:573:18)
    at Object.readFileSync (node:fs:452:35)
    at Class.afterInstall (/tmp/ember-cli202467-269477-1kv7yy7.wxv6/node_modules/@embroider/app-blueprint/index.js:69:30)
    at Class._process (🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/models/blueprint.js:466:21)
    at async InstallBlueprintTask.run (🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/tasks/install-blueprint.js:49:5)
    at async Class.run (🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/commands/init.js:108:5)
    at async Class.run (🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/commands/new.js:127:12)
    at async 🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/cli/cli.js:166:32
    at async CLI.run (🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/cli/cli.js:213:14)
    at async module.exports (🏠/.npm/_npx/51048be46e5ecfec/node_modules/ember-cli/lib/cli/index.js:96:12)

=================================================================================

using `ember init` to update projects made with this blueprint fails if you're already removed ember-fetch, etc

error:

🚧  Installing packages... This might take a couple of minutes.
pnpm: Installed @embroider/core@unstable, @embroider/vite@unstable and 5 other packages

🚧  Installing packages... This might take a couple of minutes.
Command failed with exit code 1: pnpm remove ember-fetch broccoli-asset-rev ember-cli-app-version ember-cli-clean-css ember-cli-dependency-checker ember-cli-sri ember-cli-terser
 ERR_PNPM_CANNOT_REMOVE_MISSING_DEPS  Cannot remove 'ember-fetch', 'broccoli-asset-rev', 'ember-cli-app-version', 'ember-cli-clean-css', 'ember-cli-dependency-checker', 'ember-cli-sri', 'ember-cli-terser': no such dependencies found

why use ember init?

ember-cli-update requires a valid ember-cli-update.json config -- so how do you get your first ember-cli-update.json config? 🙈

Watch mode doesn't work

I make a change to a file with the server running

page does not refresh / no network activity
after manual refresh, changes are not reflected

Cannot resolve addons

The default output does not work (anymore). First failure is related to ember-data, also happening in CI: https://github.com/embroider-build/app-blueprint/actions/runs/9531821605/job/26273191799#step:7:75

When removing e-d, it fails to resolve app-js from addons:

Not sure what could have happened between CI runs #59 (passed 2d ago) and the now failing one!? 🤔

Initializers not executed when using Vite

Hello,

Thank you for this awesome blueprint! 🐹

I'm not sure if this is the correct place to post this, but I noticed the initializers were not executed by ember-load-initializers in my project.

I'm trying to use ember-simple-auth, but it fails because the initializers are not executed.

Here is a reproduction of the issue: https://github.com/AmauryD/vite-initializers-not-working

Got the same problem here : https://github.com/TRIPTYK/ember-boilerplate/blob/main/app/app.ts

Default console output initially hides the port/host information

have to scroll up to see:

Add tests for dev mode to the app blueprint

We were having issues with EsBuild resolver when we spotted that the CI of the app blueprint wasn't able to notify us about the EsBuild resolver errors happening when starting the generated app. This is because the tests of the app blueprint always use a Vite build and don't start the Vite dev server.

I think this is an issue, because after using the blueprint, the first thing a developer would do is starting the dev server, and the CI of the app blueprint should let us know it goes well.

Failed to import components

Fresh install of v0.5.1 breaks as soon as you add a simple component e.g. components/foobar.hbs and then include it in application.hbs with <Foobar />.

[plugin:vite:import-analysis] Failed to resolve import "#embroider_compat/components/foobar" from "tmp/rewritten-app/templates/application.hbs". Does the file exist?
/Users/aalimovs/WebstormProjects/automations/admin/tmp/rewritten-app/templates/application.hbs:1:22
1  |  import foobar_ from "#embroider_compat/components/foobar";
   |                       ^
2  |  import { createTemplateFactory } from "@ember/template-factory";
3  |  export default createTemplateFactory(

Linting configuration is incorrect (and deps out of date)

After formatting my file, I get a stray [

import { pageTitle } from "ember-page-title";
import Route from "ember-route-template";

export default Route([
  <template>
    {{pageTitle "MyFancyApp"}}


    {{outlet}}
  </template>
);

Looks like all the lint deps are at least a major behind

Updates needed:

eslint-plugin-ember @ 12.1.1 +
ember-template-lint @ 6.0.0 +
eslint > 8, < 9

eslint config changes needed for gjs/gts: https://github.com/ember-cli/eslint-plugin-ember?tab=readme-ov-file#gtsgjs