Dev server failing - Githubissues

alexristich commented 3 years ago

In initializing a new project with create-single-spa, I ran into an issue with the webpack server:

[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'firewall'. These properties are valid:
   object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, setupExitSignals?, static?, watchFiles?, webSocketServer? }
 - options.client has an unknown property 'host'. These properties are valid:
   object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }

In taking a closer look, it seems webpack-dev-server, a beta release, put out their first release candidate yesterday. This introduced some breaking changes, hence the incompatibility.

I was able to get this working locally by modifying packages/webpack-config-single-spa/lib/webpack-config-single-spa.js to reflect the recent changes. I'll open a PR shortly with the proposed changes.

joeldenning commented 3 years ago

Fix released in webpack-config-single-spa@4.0.0. See https://github.com/single-spa/create-single-spa/blob/main/packages/webpack-config-single-spa/CHANGELOG.md#400 for migration instructions

alexristich commented 3 years ago

Hey @joeldenning, seems this doesn't yet work with yarn create single-spa --framework react. I'm struggling to follow exactly where the dependencies lie, but it seems create-single-spa uses generator-single-spa, and in https://github.com/single-spa/create-single-spa/commit/5dc82a6ce97a72a53dc2533fe45d2f02504be4e9 there weren't any changes in generator-single-spa's package.json file to include the new versions of webpack-config-single-spa{-react,-ts,-react-ts}, so it's still using webpack-config-single-spa@3.1.0 in the dependencies:

webpack-config-single-spa-ts@2.2.4, webpack-config-single-spa-ts@^2.2.2:
  version "2.2.4"
  resolved "https://registry.yarnpkg.com/webpack-config-single-spa-ts/-/webpack-config-single-spa-ts-2.2.4.tgz#5b9bbd3ff520eb6fb21a2ea635fb4b9f5c68040a"
  integrity sha512-VKAQdrPZ6KTarzPsNmv9Z+GRGwHKWZ3A/QhZUbbxBh0RIsdfxk233A7FUP8aAP8n8WxNlcV583J1ytGsHTxFbQ==
  dependencies:
    fork-ts-checker-webpack-plugin "^6.2.12"
    typescript "^4.1.2"
    webpack-config-single-spa "3.1.0"  <<<
    webpack-merge "^5.8.0"

webpack-config-single-spa@3.1.0:
  version "3.1.0"
  resolved "https://registry.yarnpkg.com/webpack-config-single-spa/-/webpack-config-single-spa-3.1.0.tgz#ec3e5384896b41c9ea15284c93413cb8b3318325"
  integrity sha512-tONwO/w6ugTjuWkWa0pcoJnsUmpNZToWenaD+IIhXbjU3fnQGUPGRuYf6tkn1YSaqpe79dyR2nIWv4XxzA5jkA==
  dependencies:
    ...

Should we also have updated the dependencies in the respective package.json files (for example root-config.package.json and react.package.json)?

joeldenning commented 3 years ago

Ah I think it's that I forgot to add generator-single-spa to the changeset, so a new version wasn't published. I'll do that now.

joeldenning commented 3 years ago

Everything's now working with create-single-spa@3.0.2 and generator-single-spa@3.1.1

alexristich commented 3 years ago

Awesome, thanks!

crisgon commented 3 years ago

@joeldenning, have you updated webpack-config-single-spa-ts? I get the error when I try to start a new project using typescript.

alexristich commented 3 years ago

@crisgon I just tried with create-single-spa@3.0.2 and it worked properly with TypeScript. Can you try again? Specifically what command are you running to create the new project?

amgippin commented 3 years ago

Hey just used create-single-spa@3.0.2 to generate an app and root-config, app works fine, root-config fails with the same reported error.

create-single-spa --moduleType root-config --framework react

joeldenning commented 3 years ago

Thanks @alexristich for helping out here.

@amgippin I just tried generating a root config with create-single-spa@3.0.2 and it worked for me. If it's not working for you, it's likely because the version of webpack-config-single-spa or webpack-dev-server is incorrect. It should use webpack-config-single-spa@>=4 and webpack-dev-server@4.0.0-rc.0. You can check package.json or package-lock.json to verify the version. In my case, both libraries were correctly installed

pantxisto commented 3 years ago

Hello @joeldenning, I'm having the same issue as @crisgon. When using singlespa like this "create-single-spa --moduleType root-config" and with typescript it throws the error posted by @alexristich . I'm using create-single-spa 3.0.2, webpack-dev-server 4.0.0-rc.0 and webpack-config-single-spa-ts 2.2.2, all of them configured by default by create-single-spa. Thanks

joeldenning commented 3 years ago

Newly generated projects should use webpack-config-single-spa-ts@3.0.0 (not 2.2.2). It looks like the following line of code wasn't updated:

https://github.com/single-spa/create-single-spa/blob/0ca13bb8de64b2329bae04f7bf92b1e9fcb5c47a/packages/generator-single-spa/src/common-templates/typescript/typescript.package.json#L6

React applications are correctly generated with typescript, but it seems root configs and util modules do not. I'll put together a fix.

joeldenning commented 3 years ago

create-single-spa@3.0.3 fixes the issue with webpack-config-single-spa-ts

single-spa / create-single-spa

Dev server failing #309