Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

@it-astro:when cannot be resolved in npm workspaces setup #186

Closed
psmyrdek opened this issue Jan 1, 2025 · 5 comments
Closed

@it-astro:when cannot be resolved in npm workspaces setup #186

psmyrdek opened this issue Jan 1, 2025 · 5 comments

Comments

@psmyrdek
Copy link

psmyrdek commented Jan 1, 2025

Hi there and Happy New Year!

For quite some time I've been struggling with Astro Cloudflare adapter (11+) being unable to resolve "@it-astro:when" package in a setup based on npm workspaces. Would it be able to provide different types/modules that adapter would import to avoid clashes with this package? Happy to hear your thoughts!

https://github.com/psmyrdek/astro-5-cf-repro

From: node_modules/@astrojs/cloudflare/dist/entrypoints/middleware.js

Problematic line: import { When, whenAmI } from '@it-astro:when';

12:02:22 [ERROR] [MiddlewareCantBeLoaded] An unknown error was thrown while loading your middleware.
  Error reference:
    https://docs.astro.build/en/reference/errors/middleware-cant-be-loaded/
  Stack trace:
    at /Users/przemek/dev/astro-5-cf-repro/projects/astro-on-cloudflare/Users/przemek/dev/astro-5-cf-repro/node_modules/astro/dist/core/middleware/loadMiddleware.js:8:24
    [...] See full stack trace in the browser, or rerun with --verbose.
  Caused by:
  Invalid module "@it-astro:when" is not a valid package name imported from /Users/przemek/dev/astro-5-cf-repro/node_modules/@astrojs/cloudflare/dist/entrypoints/middleware.js
    at parsePackageName (node:internal/modules/esm/resolve:782:11)
    at moduleResolve (node:internal/modules/esm/resolve:927:18)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)
    at link (node:internal/modules/esm/module_job:86:36)

Ref: withastro/adapters#343

@Fryuni
Copy link
Owner

Fryuni commented Jan 1, 2025

This error happens when the Astro When integration is not loaded. There is nothing that the integration can do to fix a problem when it is not loaded.

You can run your build with the environment variable DEBUG=inox-tools:astro-when to check whether the code from the Astro When integration is running. If it isn't, then the problem is before anything we can control.

@psmyrdek
Copy link
Author

psmyrdek commented Jan 2, 2025

Thanks for feedback. So I added explicit addon to integrations array, the code runs but it doesn't fix the issue. In cloudflare adapter, which seems to be related to this, there's also axplicit addition of this module in the plugin code. Yet, still with no effect.

> [email protected] dev
> astro dev

  inox-tools:astro-when Adding Vite plugin +0ms
  inox-tools:astro-when Adding Vite plugin +0ms
09:51:01 [WARN] [@inox-tools/astro-when] The Vite plugin "@inox-tools/astro-when" is already present in your Vite configuration, this plugin may not behave correctly.
09:51:01 [WARN] [@astrojs/cloudflare] [@astrojs/cloudflare] This adapter is intended to be used with server rendered pages, which this project does not contain any of. As such, this adapter is unnecessary.
09:51:01 [WARN] [config] The adapter @astrojs/cloudflare has limited support for "sharp". Certain features may not work as expected.
  inox-tools:astro-when Injecting types in .astro structure +3ms
  inox-tools:astro-when Injecting types in .astro structure +0ms
09:51:01 [types] Generated 0ms

 astro  v5.1.1 ready in 631 ms

┃ Local    http://localhost:3000/
┃ Network  use --host to expose

09:51:01 [content] Syncing content
09:51:01 [content] Synced content
09:51:01 watching for file changes...

warn - No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.
warn - https://tailwindcss.com/docs/content-configuration
09:51:13 [ERROR] [MiddlewareCantBeLoaded] An unknown error was thrown while loading your middleware.
  Error reference:
    https://docs.astro.build/en/reference/errors/middleware-cant-be-loaded/
  Stack trace:
    at /Users/przemek/dev/astro-5-cf-repro/projects/astro-on-cloudflare/Users/przemek/dev/astro-5-cf-repro/node_modules/astro/dist/core/middleware/loadMiddleware.js:8:24
    [...] See full stack trace in the browser, or rerun with --verbose.
  Caused by:
  Invalid module "@it-astro:when" is not a valid package name imported from /Users/przemek/dev/astro-5-cf-repro/node_modules/@astrojs/cloudflare/dist/entrypoints/middleware.js
    at parsePackageName (node:internal/modules/esm/resolve:782:11)
    at moduleResolve (node:internal/modules/esm/resolve:927:18)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)
    at link (node:internal/modules/esm/module_job:86:36)

From CF:

export default function createIntegration(args) {
    let _config;
    const cloudflareModulePlugin = cloudflareModuleLoader(args?.cloudflareModules ?? true);
    return {
        name: '@astrojs/cloudflare',
        hooks: {
            'astro:config:setup': ({ command, config, updateConfig, logger, addWatchFile, addMiddleware, }) => {
                updateConfig({
                    build: {
                        client: new URL(`.${wrapWithSlashes(config.base)}`, config.outDir),
                        server: new URL('./_worker.js/', config.outDir),
                        serverEntry: 'index.js',
                        redirects: false,
                    },
                    vite: {
                        plugins: [
                            // https://developers.cloudflare.com/pages/functions/module-support/
                            // Allows imports of '.wasm', '.bin', and '.txt' file types
                            cloudflareModulePlugin,
                            {
                                name: 'vite:cf-imports',
                                enforce: 'pre',
                                resolveId(source) {
                                    if (source.startsWith('cloudflare:')) {
                                        return { id: source, external: true };
                                    }
                                    return null;
                                },
                            },
                        ],
                    },
                    integrations: [astroWhen()],
                    image: setImageConfig(args?.imageService ?? 'compile', config.image, command, logger),
                });

@Fryuni
Copy link
Owner

Fryuni commented Jan 23, 2025

I still can't reproduce the problem, even with your reproduction project, but it seems from your logs that the integration is being added twice. As the warning shows, having it twice is not supported and may misbehave:

09:51:01 [WARN] [@inox-tools/astro-when] The Vite plugin "@inox-tools/astro-when" is already present in your Vite configuration, this plugin may not behave correctly.

@psmyrdek
Copy link
Author

psmyrdek commented Feb 3, 2025

https://github.com/psmyrdek/astro-5-cf-repro/actions/runs/13112878566/job/36580449315

Just added example workflow to reproduce the issue. After launching dev server I'm making a generic GET to localhost:3000 to prove that the page cannot be loaded.

@Fryuni
Copy link
Owner

Fryuni commented Feb 20, 2025

I did manage to reproduce with the same commands as GH Actions. It seems Vite is having a problem resolving references on an NPM workspace during dev. Since Vite uses esbuild for dev server and rollup for prod builds this problem might be on esbuild, but I'd report it on Vite first.

Installing the dependencies in the project itself work fine, and so does using PNPM or Yarn workspaces. All of those have the dependencies on node_modules under the project root, which AFAIK is where Vite assumes all modules used in the project will be and that may be due to esbuild.

PNPM and Yarn workspaces both use linking to have a node_modules in the subpackage and work fine. NPM workspace seems to do something different and that is not playing well with Vite.

It is not in the scope of the package to workaround the messy state of JS package managers and bundlers not working with each other and each doing its own thing, so I'm gonna close this. Sorry.

@Fryuni Fryuni closed this as not planned Won't fix, can't repro, duplicate, stale Feb 20, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants