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

[LiveComponent] Running npm install --force fails with "This is related to npm not being able to find a file." #1567

Closed
brabli opened this issue Mar 1, 2024 · 10 comments

Comments

@brabli
Copy link

brabli commented Mar 1, 2024

When trying to install the latest version of UX Live Component I can successfully install the package with composer.
When I run npm install --force however the command fails with an error message that suggests it can't find a file (see image).

npm_output

My package.json points at a file in my vendor folder:

"@symfony/ux-live-component": "file:vendor/symfony/ux-live-component/assets",

...and upon inspection the directory in question it appears to look fine, containing it's own package.json alongside a dist and styles directory.

I have attatched the npm log file in case it's useful at all.

2024-03-01T13_00_54_787Z-debug-0.log

@pcmmf
Copy link

pcmmf commented Mar 18, 2024

Just to confirm I have the same issue. It occurred after a composer update to the v2.16.0 versions of the bundles.

@smnandre
Copy link
Member

Could it be related to this dependency ?

"dependencies": {
        "idiomorph": "https://github.com/bigskysoftware/idiomorph.git"
 },

@pcmmf
Copy link

pcmmf commented Mar 19, 2024

Yes, removing that from vendor/symfony/ux-live-component/assets/package.json did allow npm to run, but anything that used the live components obviously wouldn't work properly.

@smnandre
Copy link
Member

If you try with this, does it work better ?

"dependencies": {
        "idiomorph": "github:bigskysoftware/idiomorph"
 },

@pcmmf
Copy link

pcmmf commented Mar 19, 2024

It doesn't seem to help in my case. I patched the file manually, but still receive the following:

npm ERR! code ENOENT
npm ERR! syscall spawn git
npm ERR! path git
npm ERR! errno -2
npm ERR! enoent An unknown git error occurred
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent 

With the line removed altogether, npm update works fine.

@smnandre
Copy link
Member

Last attempt (but maybe the good one 🤞 )

"dependencies": {
        "idiomorph": "^0.3.0"
 },

@pcmmf
Copy link

pcmmf commented Mar 19, 2024

With that change, npm update now works, but it seems the live components are not working. I have a form based live component which worked prior to this issue. Now, the page is POSTed - seemingly the JavaScript isn't intercepting the request. I get a console error of:

405.4e849f84.js:2 Error invoking action "submit->live#action" Error: No action name provided on element. Did you forget to add the "data-live-action-param" attribute?

Prior to 2.16, my component twig looked like this:

{{ form_start(form, {
        attr: {
            'novalidate': true,
            'data-action': 'live#action',
            'data-action-name': 'prevent|calculate',
        }
    }) }}

I tried changing this to:

{{ form_start(form, {
        attr: {
            'novalidate': true,
            'data-action': 'live#action',
            'data-live-action-param': 'prevent|calculate',
        }
    }) }}

This then gives the console error: app.728fce7b.js:1 Unknown modifier prevent in action "prevent|calculate". Available modifiers are: stop, self, debounce, files.

So, it seems the change to the dependencies you mentioned @smnandre works, but I potentially have some other tidying up to do to make it work with v2.16.

@smnandre
Copy link
Member

Indeed you'll have a bit of work, but this should go well (i hope) : https://github.com/symfony/ux/blob/2.x/UPGRADE.md

@smnandre
Copy link
Member

Thank you for testing this, i'll open a PR to fix the bug.

@pcmmf
Copy link

pcmmf commented Mar 19, 2024

@smnandre No problem. The changes from the UPGRADE.md work fine too, thanks!

@kbond kbond closed this as completed in b8076f8 Mar 21, 2024
kbond added a commit that referenced this issue Mar 21, 2024
…dre)

This PR was merged into the 2.x branch.

Discussion
----------

[LiveComponent] Fix idiomorph dependency (fix #1567)

Current idiomorph dependency does not work for some users with npm

Now it's available as a ES module it should fix the problem

Thanks `@pcmmf` for the hand

Commits
-------

b8076f8 [LiveComponent] Fix idiomorph dependency (fix #1567)
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

3 participants