Can Anyone help me fix this phx server error?

I got the error like this

[warning] Phoenix is unable to create symlinks. Phoenix’ code reloader will run considerably faster if symlinks are allowed. On Windows, the lack of symlinks may even cause empty assets to be served. Luckily, you can address
this issue by starting your Windows terminal at least once with “Run as Administrator” and then running your Phoenix application.
[info] Running WowWeb.Endpoint with cowboy 2.9.0 at 127.0.0.1:4000 (http)
[info] Access WowWeb.Endpoint at http://localhost:4000
??[WARNING] The CommonJS “module” variable is treated as a global variable in an ECMAScript module and may not work as expected

vendor/topbar.js:149:4:
  149 ??    module.exports = topbar;
      ??    ~~~~~~

This file is considered to be an ECMAScript module because the enclosing “package.json” file sets the type of this file to “module”:

../../../../../package.json:5:10:
  5 ??  "type": "module",
    ??          ~~~~~~~~

??[WARNING] Top-level “this” will be replaced with undefined since this file is an ECMAScript module

vendor/topbar.js:157:7:
  157 ??}.call(this, window, document));
      ??       ~~~~
      ??       undefined

This file is considered to be an ECMAScript module because the enclosing “package.json” file sets the type of this file to “module”:

../../../../../package.json:5:10:
  5 ??  "type": "module",
    ??          ~~~~~~~~

X [ERROR] No matching export in “vendor/topbar.js” for import “default”

js/app.js:27:7:
  27 ??import topbar from "../vendor/topbar"
     ??       ~~~~~~

Today I start the server, got this warning, error and the phx doesn’t work!
It was working OK just last week and today I’m stuck in here.
The CSS doesn’t work, the router doesn’t work.
Even I made a new phx with phx.new and It got the same error like that.
I’m running this in Window.

Hi @menw , yeah this is a rather confusing issue, not really with Phoenix or Elixir but with the JavaScript ecosystem. It stems from the fact that several alternative ways to implement modules exist in JavaScript, and they are generally incompatible with each other.

This seems to be the source of the problem: your package.json specifies "type": "module". This means that all files with extension .js will be considered ES modules (using export and import), as opposed to CommonJS modules (using module.exports and require).

The problem is that the topbar.js file is using CommonJS constructs such as module.exports, and this triggers the error.

You can try to fix it by renaming topbar.js to topbar.cjs, to force the system to consider it a CommonJS file. Alternatively, you have to port it to ES module syntax.

2 Likes

ThankYou!!!

1 Like