Yarn develop --watch-admin is not working

General
1

I am developing a local plugin and in this process I need to run
yarn build & yarn develop to even see the smallest of changes to reflect on UI.

Fortunately, recently I came to know we can use yarn develop --watch-admin command while building local plugin. But, it is not working. URL is generating only for http://localhost:1337.
I am receiving 404 for http://localhost:1337/admin

2 Likes
2

Facing the same issue. Did you find any solution to this?

1 Like
3

Nope, not yet :frowning_face:

4

I had the same issue. I believe it is related to this port issue

Their workaround listed worked for me:

//Setting port in ./admin/webpack.config.js

module.exports = (config, webpack) => {
  config.devServer = {
    ...config.devServer, // this is actually `undefined`, but just in case:)
    port: 3000,
  };

  return config;
};
1 Like
5

Not working for me :roll_eyes:

There is no Error log in Node in stdout… what is even the 8000 port?

Browser console:

GET http://localhost:1339/admin/project-type 404 (Not Found)
./.cache/admin/src/index.js @ main.bundle.js:42806
...
10:45:51.375 main.bundle.js:42759 Error: Request failed with status code 404
    at createError (main.bundle.js:39963:15)
    at settle (main.bundle.js:40255:12)
    at XMLHttpRequest.onloadend (main.bundle.js:39291:7)

Node out:

$ strapi watch-admin
Starting the development server...

Admin development at http://localhost:8000/admin/
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:1339/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.100.1:1339/
<i> [webpack-dev-server] Content not from webpack is served from '...\Learn\strapi-4-hello2\public' directory
<i> [webpack-dev-server] 404s will fallback to '/admin/'

Changed every port to 1339

  • .env (PORT=1339)
  • config/server.js (port: env.int(“PORT”, 1339),)
  • src\admin\webpack.config.js (port: 1339,)
6

It was my mistake!

I used strapi watch-admin command not strapi develop --watch-admin.

I did not known there was two different action, hmmm :face_with_monocle:

so it working now, thnx!

7

I used the devServer fix and although my admin system now works, it keeps logging me out every second code change when chrome refreshes. The changes do appear but its not a good experience if I have to log in every code change?

It throws a Warning, An error occurred while requesting the API error before and infinite loading, and then goes back to the log in window.

Looking at the network it tries to do a request to http://localhost:1337/admin/project-type, and theres a connection refused error. Looking at the nodejs logs it might be trying to connect to the backend api and since its down (due to restarting during a file change)

File changed: /src/plugins/testplugin/admin/src/pages/HomePage/index.js
[2022-02-06 01:35:20.721] info: The server is restarting

Can anyone help?

8

@mali Here is a discussion on a workaround for the logging out after a code change issue.

9

I get the same issue but only if i use a typescript strapi project. Otherwise, if a use a javascript strapi project, “npm develop – --watch-admin” works fine.
Also, I have stared using yarn because is solving better dependencies issues, but still doesn’t work.

10

Finally, I fixed it.
I deleted all the “dist” and “node_modules” folders, from the custom plugin and core app. Then:

  • At the core app run “yarn”
  • At the custom plugin folder run “yarn” and then “yarn build”
  • At the core app run “yarn strapi build”
  • And, finally, run “yarn strapi develop --watch-admin”