Issue with generated skeleton for app

💻 Development
1

Hello,

I’m having an issue with the generated skeleton app when trying to follow one of the tutorials: Developing a complete app with a navigation bar and database

The issue is with installing NPM dependencies. After setting the NVM to 16, I get the following errors:

npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/auth@2.2.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/browser-storage@0.3.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/browserslist-config@3.0.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/capabilities@1.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/dialogs@5.1.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/axios@2.4.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/eslint-config@8.3.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/eslint-plugin@2.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/files@3.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/initial-state@2.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/l10n@2.2.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/logger@2.7.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/router@2.2.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^10.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/stylelint-config@2.4.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^10.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/vue@8.5.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/vue-select@3.25.0',
npm WARN EBADENGINE   required: { node: '^20.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/axios@2.4.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/calendar-js@6.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/webpack-vue-config@6.0.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: 'debounce@2.0.0',
npm WARN EBADENGINE   required: { node: '>=18' },
npm WARN EBADENGINE   current: { node: 'v16.20.2', npm: '7.7.2' }
npm WARN EBADENGINE }

However, if I set NVM to 20, which some of them require, I get the following:

npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: 'bmcnotebook@0.0.1',
npm WARN EBADENGINE   required: { node: '^16.0.0', npm: '^7.0.0 || ^8.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/auth@2.2.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/browser-storage@0.3.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/browserslist-config@3.0.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/capabilities@1.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/browserslist-config@2.3.0',
npm WARN EBADENGINE   required: { node: '^16.0.0', npm: '^7.0.0 || ^8.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/dialogs@5.1.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/axios@2.4.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/eslint-config@8.3.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/eslint-plugin@2.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/event-bus@3.1.0',
npm WARN EBADENGINE   required: { node: '^16.0.0', npm: '^7.0.0 || ^8.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/files@3.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/initial-state@2.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/l10n@2.2.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/logger@2.7.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/typings@1.7.0',
npm WARN EBADENGINE   required: { node: '^16.0.0', npm: '^7.0.0 || ^8.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/vue@8.5.1',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/axios@2.4.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/calendar-js@6.1.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@nextcloud/webpack-vue-config@6.0.0',
npm WARN EBADENGINE   required: { node: '^20.0.0', npm: '^9.0.0' },
npm WARN EBADENGINE   current: { node: 'v20.11.0', npm: '10.4.0' }
npm WARN EBADENGINE }

Basically, I’m not able to complete the tutorial because of apparent mismatches between Node and NPM dependencies (some require 7.x.x NPM, others 9.x.x NPM). When using the app skeleton generator, I tried with both versions 27 and 28 with no luck. I’ve also tried with both the development Nextcloud version (29.0.0) and the stable version (28).

I was able to go through a few of the other tutorials with the setup as outlined in Install Nextcloud Docker.

I’m unsure where the issue lies. Is there anyone that can point me in the right direction?

2

First, these are just warnings. In my apps, I have some similar issues but this is not really a breaking problem.

You could reduce the problem by going with node 20 but downgrade npm to 9 instead of the installed 10. Then there should be only a few left.

Additionally, you could should check, if the complaining dependencies cannot be updated.

What is your definition of it is not working? Are there more errors or is the generated JavaScript output plainly wrong and non-functional?

3

Oh! OK. I thought they were blocking each other, which was confusing because I know other people are using it just fine, so I thought I somehow did something wrong. Thanks for clarifying.

1 Like