🐛 Bug Report: TypeError: Cannot read properties of undefined (reading 'createServer')

[marcpalm]

📜 Description

While running the frontend with EXPERIMENTAL_VITE=true, it crashes with

TypeError: Cannot read properties of undefined (reading 'createServer')

👍 Expected behavior

App starts up. This happened on our app while upgrading all modules, but can be reproduced with https://github.com/backstage/demo

👎 Actual Behavior with Screenshots

Return TypeError: Cannot read properties of undefined (reading 'createServer') and stops.

👟 Reproduction steps

Run https://github.com/backstage/demo with vite enabled.

📃 Provide the context for the Bug.

Problem is here:

backstage/packages/cli/src/lib/bundler/server.ts

Line 174 in 9c45fa1

viteServer = await vite.createServer({

Dynamic import works when changed to const vite = import('vite'), the default seems not properly resolved.

🖥️ Your Environment

Node 18 or 20
yarn
MacOS

👀 Have you spent some time to check if this bug has been raised before?

• I checked and didn't find similar issue

🏢 Have you read the Code of Conduct?

• I have read the Code of Conduct

Are you willing to submit PR?

No, but I'm happy to collaborate on a PR with someone else

[alper98]

Im on the same team as @marcpalm. Just commenting our backstage info here:

OS:   Darwin 23.4.0 - darwin/arm64
node: v20.11.1
yarn: 4.1.1
cli:  0.26.4 (installed)
backstage:  1.26.5

Dependencies:
  @backstage/app-defaults                                          1.5.4
  @backstage/backend-app-api                                       0.7.2
  @backstage/backend-common                                        0.21.7
  @backstage/backend-defaults                                      0.2.17
  @backstage/backend-dev-utils                                     0.1.4
  @backstage/backend-openapi-utils                                 0.1.10
  @backstage/backend-plugin-api                                    0.6.17
  @backstage/backend-tasks                                         0.5.22
  @backstage/backend-test-utils                                    0.3.7
  @backstage/catalog-client                                        1.6.4
  @backstage/catalog-model                                         1.4.5
  @backstage/cli-common                                            0.1.13
  @backstage/cli-node                                              0.2.5
  @backstage/cli                                                   0.26.4
  @backstage/config-loader                                         1.8.0
  @backstage/config                                                1.0.8, 1.2.0
  @backstage/core-app-api                                          1.12.4
  @backstage/core-compat-api                                       0.1.1, 0.2.4
  @backstage/core-components                                       0.12.5, 0.13.10, 0.14.6
  @backstage/core-plugin-api                                       1.9.2
  @backstage/dev-utils                                             1.0.31
  @backstage/errors                                                1.2.4
  @backstage/eslint-plugin                                         0.1.7
  @backstage/frontend-plugin-api                                   0.3.0, 0.4.0, 0.5.0, 0.6.4
  @backstage/integration-aws-node                                  0.1.12
  @backstage/integration-react                                     1.1.26
  @backstage/integration                                           1.10.0
  @backstage/plugin-api-docs                                       0.11.4
  @backstage/plugin-app-backend                                    0.3.65
  @backstage/plugin-app-node                                       0.1.17
  @backstage/plugin-auth-backend-module-atlassian-provider         0.1.9
  @backstage/plugin-auth-backend-module-aws-alb-provider           0.1.9
  @backstage/plugin-auth-backend-module-azure-easyauth-provider    0.1.0
  @backstage/plugin-auth-backend-module-bitbucket-provider         0.1.0
  @backstage/plugin-auth-backend-module-cloudflare-access-provider 0.1.0
  @backstage/plugin-auth-backend-module-gcp-iap-provider           0.2.12
  @backstage/plugin-auth-backend-module-github-provider            0.1.14
  @backstage/plugin-auth-backend-module-gitlab-provider            0.1.14
  @backstage/plugin-auth-backend-module-google-provider            0.1.14
  @backstage/plugin-auth-backend-module-guest-provider             0.1.3
  @backstage/plugin-auth-backend-module-microsoft-provider         0.1.12
  @backstage/plugin-auth-backend-module-oauth2-provider            0.1.14
  @backstage/plugin-auth-backend-module-oauth2-proxy-provider      0.1.10
  @backstage/plugin-auth-backend-module-oidc-provider              0.1.8
  @backstage/plugin-auth-backend-module-okta-provider              0.0.10
  @backstage/plugin-auth-backend                                   0.22.4
  @backstage/plugin-auth-node                                      0.2.19, 0.4.12
  @backstage/plugin-auth-react                                     0.1.1
  @backstage/plugin-catalog-backend-module-github                  0.6.0
  @backstage/plugin-catalog-backend-module-scaffolder-entity-model 0.1.15
  @backstage/plugin-catalog-backend-module-unprocessed             0.4.4
  @backstage/plugin-catalog-backend                                1.21.1
  @backstage/plugin-catalog-common                                 1.0.22
  @backstage/plugin-catalog-graph                                  0.4.4
  @backstage/plugin-catalog-import                                 0.10.10
  @backstage/plugin-catalog-node                                   1.11.1
  @backstage/plugin-catalog-react                                  1.11.3
  @backstage/plugin-catalog-unprocessed-entities-common            0.0.1
  @backstage/plugin-catalog-unprocessed-entities                   0.2.3
  @backstage/plugin-catalog                                        1.19.0
  @backstage/plugin-devtools-backend                               0.3.3
  @backstage/plugin-devtools-common                                0.1.9
  @backstage/plugin-devtools                                       0.1.13
  @backstage/plugin-events-backend                                 0.3.4
  @backstage/plugin-events-node                                    0.3.3
  @backstage/plugin-home-react                                     0.1.12
  @backstage/plugin-home                                           0.5.11, 0.7.3
  @backstage/plugin-org                                            0.6.24
  @backstage/plugin-permission-backend                             0.5.41
  @backstage/plugin-permission-common                              0.7.13
  @backstage/plugin-permission-node                                0.7.28
  @backstage/plugin-permission-react                               0.4.22
  @backstage/plugin-proxy-backend                                  0.4.15
  @backstage/plugin-scaffolder-backend-module-azure                0.1.9
  @backstage/plugin-scaffolder-backend-module-bitbucket-cloud      0.1.7
  @backstage/plugin-scaffolder-backend-module-bitbucket-server     0.1.7
  @backstage/plugin-scaffolder-backend-module-bitbucket            0.2.7
  @backstage/plugin-scaffolder-backend-module-gerrit               0.1.9
  @backstage/plugin-scaffolder-backend-module-gitea                0.1.7
  @backstage/plugin-scaffolder-backend-module-github               0.2.7
  @backstage/plugin-scaffolder-backend-module-gitlab               0.3.3
  @backstage/plugin-scaffolder-backend                             1.22.5
  @backstage/plugin-scaffolder-common                              1.5.1
  @backstage/plugin-scaffolder-node                                0.4.3
  @backstage/plugin-scaffolder-react                               1.8.4
  @backstage/plugin-scaffolder                                     1.19.3
  @backstage/plugin-search-backend-module-catalog                  0.1.23
  @backstage/plugin-search-backend-module-pg                       0.5.26
  @backstage/plugin-search-backend-module-techdocs                 0.1.22
  @backstage/plugin-search-backend-node                            1.2.21
  @backstage/plugin-search-backend                                 1.5.7
  @backstage/plugin-search-common                                  1.2.11
  @backstage/plugin-search-react                                   1.7.10
  @backstage/plugin-search                                         1.4.10
  @backstage/plugin-techdocs-backend                               1.10.4
  @backstage/plugin-techdocs-module-addons-contrib                 1.1.9
  @backstage/plugin-techdocs-node                                  1.12.3
  @backstage/plugin-techdocs-react                                 1.2.3
  @backstage/plugin-techdocs                                       1.10.4
  @backstage/plugin-user-settings                                  0.7.14, 0.8.5
  @backstage/release-manifests                                     0.0.11
  @backstage/repo-tools                                            0.8.0
  @backstage/test-utils                                            1.5.4
  @backstage/theme                                                 0.4.0, 0.2.19, 0.4.4, 0.5.3
  @backstage/types                                                 1.1.1
  @backstage/version-bridge                                        1.0.8

[alper98]

Reproduction steps on the demo site:

1. add this to the package.json of the app

   "@vitejs/plugin-react": "^4.0.4",
   "vite": "^4.4.9",
   "vite-plugin-html": "^3.2.0",
   "vite-plugin-node-polyfills": "^0.21.0"

2. run yarn install
3. run EXPERIMENTAL_VITE=true yarn workspace app start

[quincarter]

Following

[quincarter]

I would also like to note that after a certain version of Vite, you are required to be on node 18+. This should probably also be updated to the latest version in backstage/cli on the vite plugins. it is on like 5.x.x. But this bug is happening for me as well. Same issue.

For me I had to actually install the dependencies listed here in my backstage instance. But getting the same error.

[alper98]

@vinzscam with the addition of the "help wanted" tag, is it safe to assume our proposed change is fine?