parcel dev server will serve index.html when --public-url is set to ./ (dev server will serve index.html to anything unrecognized)

[doomleika]

🐛 bug report

As title. I have used --public-url ./ as a temporary workaround within VSCode's sourcemap behavior documented here. This will made asset linked within compiled html from <script src="/js.8e7f6a41.js"> to <script src="js.8e7f6a41.js">. Without the slash the dev server will consider this unknown path and serve index.html. By using other dev server solution like http-server to serve dist will not exhibit such problem.

I believe this behavior is more confusing than helpful to most users.

🤔 Expected Behavior

Have dev server act more similarly to regular http server than automatically try to 'correct' unknown path

😯 Current Behavior

Dev server will serve any path unregonized with index.html, and many magic seems to be confusing to me.

[DeMoorJasper]

This is to support Single Page Applications, as these might have internal front-end routing, that can't work without redirecting everything to the index.html file

[doomleika]

Thanks for your reply. but is serve index.html with request like js.8e7f6a41.js as index.html seems to be rather confusing. Is there anyway to workaround that. Without resorting external package like http-server of course.

That said, I think adding a flag like --no-spa is probably not an option as that does not fit parcel's zero config philosophy.

[DeMoorJasper]

Perhaps we can see if the extension of the request equals one of the types parcel has registered (in the parser) and return a 404 or the actual asset in that case?

[doomleika]

This solution fits my use case perfectly, but I am not really a frontend expert. Not sure if this will break somebody else's setup.

[domenkozar]

This is to support Single Page Applications, as these might have internal front-end routing, that can't work without redirecting everything to the index.html file

maybe that could be non-default behaviour enabled by --spa-routing?

[patrickhulce]

I'm running into this issue as well even on just the index page. I guess my question is why is this considered an unknown path? When on ///index.html/etc, ./bundle.0af421.js resolves to the exact same URL as /bundle.0af421.js so shouldn't it just serve the correct file like normal?

[alex-benoit]

running into this as well

I use parcel to build a simple html css js page (using it for minification, autoprefixer, scss, etc.)
I used to run it like this parcel index.html

Just noticed the multiple page support so decided to add a privacy.html and now run parcel as parcel index.html privacy.html and build as such parcel build index.html privacy.html --public-url . --out-dir docs/ (for github pages support)

On github pages all works as expected (going to the root path servers index.html and /privacy the privacy policy. However using the server I can only access the pages with localhost:1234/index.html and localhost:1234/privacy.html

Is this the expected behaviour?

[qm3ster]

I too am looking for a --clean-urls type behavior (/foo->/foo.html)
rather than --spa-routing type behavior (/foo->/index.html) in some cases.

[dingbat]

In case this helps anyone, I used .proxyrc.js as a workaround (or perhaps even this is the recommended solution) in Parcel 2. Something like this:

const { createProxyMiddleware } = require("http-proxy-middleware");

module.exports = function (app) {
  app.use(
    createProxyMiddleware(
      (path) => path.match(/^\/foo\/?$/),
      {
        target: "http://localhost:1234/",
        pathRewrite: { "/foo": "/foo/index.html" },
      })
  );
};

Make sure to include the $ at the end of the filter regex, otherwise you'll get into an infinite rewrite loop. From here, it wouldn't be too hard to do a general purpose rule to rewrite trailing / -> /index.html, but my use case was to only rewrite one path.

[thewilkybarkid]

I think my problem is related to this: I've never been able to view anything other than my index.html when using parcel serve. Other HTML files are built correctly (I can see them in dist), but I seem unable to access them using the Parcel server.

I'm going to workaround it by running parcel watch and serve dist in parallel (the latter being the npm library, not parcel serve).

[DougReeder]

Certainly some SPAs need this behavior, but it's odd there's no flag to behave like a normal HTTP server.