0

I am very new to spfx development. I working with two different spfx webparts and I wanted to run both of them at the same time but it run both on 4321 default port.

I try to change port in serve.json inside config folder but always run on default webpart. How can I change port

My serve.json

{
  "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
  "port": 4321,
  "https": true,
  "initialPage": "https://localhost:5432/workbench",
  "api": {
    "port": 5432,
    "entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"
  }
}
  • will it be possible for you to share serve.json ? – Ravi Nov 15 '19 at 11:13
  • @Ravi I have updated my question with serve.json – Milind Nov 15 '19 at 11:14
1

I have not tried this but can you try like this :

First webpart's config.json

{
  "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
  "port": 4321,
  "https": true,
  "initialPage": "https://localhost:5432/workbench",
  "api": {
  "port": 5432,
  "entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"
  }
}

Second webpart's config.json

{
  "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
  "port": 4321,
  "https": true,
  "initialPage": "https://localhost:5432/workbench",
  "api": {
  "port": 8080, //Changed Port Number here
  "entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"
  }
}

Now run gulp serve for both the webparts and both webparts should use the different port to display respective webpart.

Let me know if this works.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.