Parcel: 🐛 sourceMappingURL is not relative to the mapped file

Created on 20 Mar 2018 · 7Comments · Source: parcel-bundler/parcel

🐛 Bug report

The generated sourceMappingURL is a mix of relative and absolute path.
Relative to the source file directory, but absolute as it starts with /.

🎛 Configuration

package.json

"scripts": {
  "watch": "parcel watch static/app.js -d static/build"
}

🤔 Expected Behavior

//# sourceMappingURL=app.map

😯 Current Behavior

//# sourceMappingURL=/build/app.map

💁 Possible Solution

Use the relative path to the map file (actually, just the file name as it's inside the same directory).

🔦 Context

When my server is configured to serve static (or "public") files under /static/<filepath>, the URL of app.map is in fact /static/build/app.map.

So the sourceMappingURL=/build/app.map is wrong and results in a "404 Not found" in the browser.

🌍 Environment

Parcel 1.6.2
Node 9.8.0
NPM 5.7.1
macOS 10.13.3 (17D102)

Bug

Source

arthurwhite

Most helpful comment

I didn't set the publicURL manually.
Now, if I use --public-url /, the sourceMappingURL will be /app.map, which is also incorrect because it's in fact /static/build/app.map.

My project structure is:

/
├── static/          # public directory
│   ├── build/       # files built by Parcel
│   │   ├── app.js
│   │   └── app.map
│   └── app.js       # original file
├── package.json
└── server.js

The solution is rather --public-url . (simply, a real relative path).

Thanks for steering me to the this flag. 👍

arthurwhite on 20 Mar 2018

👍8

All 7 comments

We write that sourcemap link comment here:
https://github.com/parcel-bundler/parcel/blob/9858937e187b2c1d7ce27fcdfb944b168063aab4/src/packagers/JSPackager.js#L204-L208

I guess your publicURL option is set to /build which is why it's returning that path. If the publicURL is set to / then you should get the behavior you're looking for (as far as I can tell).

For a quick fix, try setting the --public-url flag to / manually:

"scripts": {
  "watch": "parcel watch static/app.js -d static/build --public-url /"
}

However this should fix it self when PR #838 lands, since it makes / the default public URL 😃

davidnagli on 20 Mar 2018

👍1

I didn't set the publicURL manually.
Now, if I use --public-url /, the sourceMappingURL will be /app.map, which is also incorrect because it's in fact /static/build/app.map.

My project structure is:

/
├── static/          # public directory
│   ├── build/       # files built by Parcel
│   │   ├── app.js
│   │   └── app.map
│   └── app.js       # original file
├── package.json
└── server.js

The solution is rather --public-url . (simply, a real relative path).

Thanks for steering me to the this flag. 👍

arthurwhite on 20 Mar 2018

👍8

Well as this is probably more related to #838 than sourcemaps I'll close this down as it's a duplicate and appears to be solved in your case

DeMoorJasper on 20 Mar 2018

👍1

@arthurwhite did you ever find a fix for this?

cphoover on 20 Jul 2018

@cphoover
As said in my last message, the --public-url flag set to . (relative path) may be a solution:

parcel watch static/app.js -d static/build --public-url .

arthurwhite on 21 Jul 2018

🎉4

Thanks,
Is there any problem with this?
Css map file generation but one less sentence in css compressed file
/*# sourceMappingURL=./common.map */

SCWR on 18 Dec 2018

Hi, this issue has bugged me for a round 2 hours today... a complete novice to parcel i thought it was my problem as many tutorials suggest putting your output in a 'dist' folder rather than loose at the root. In the end setting '--public-url /dist/' fixed it for me. Admittedly it is in the docs (https://parceljs.org/cli.html) but I feel like some sort of warning might help. e.g in the minified file it could say 'to change this set the public url..'. Thanks.