Parcel: How can i ignore bundling of images?

[nrgwsth]

Is there any way in parcel to ignore bundling of certain assets. I am running parcel on my html file and i only want to bundle my js files. Is there any way to achieve this?

[DeMoorJasper]

You can use multiple entrypoints to only bundle javascript.
There currently is no way to ignore certain files.
Duplicate of #144, #1186, #357 and #1087

[derolf]

All the referenced tickets contain some sort of workaround or special semantics to avoid having a configuration.

I think we are in a catch22 here — what is the lesser evil: special semantics, workarounds, or a configuration?

[sgf]

@DeMoorJasper

how Exclude some Modules such like Vue.js,i hope the parcel do not pack Vue in the Single Js output file.

[DeMoorJasper]

@sgf not sure if I understand, Vue is part of the app right?

Open up a new issue with examples and a more detailed description

[sgf]

@DeMoorJasper
yes but some time ppl need use CDN.
and i found the parcel Parse some dependencies is incorrect

my problem is same like https://github.com/parcel-bundler/parcel/issues/144

[npulidom]

@nrgwsth, if you are using stylus, I resolved using embedurl instead of url or src directives in your stylus files. Parcel will ignore that directive and stylus will replace that directive for url, keeping the relative path.

.my-class
    background embedurl('../images/icons/action/upload.svg') no-repeat

[revelt]

I think this ticket was closed prematurely and should be reopened. #144 is about node_modules and ignoring React.

If it helps, let me describe the problem again.

Imagine a static website project (Eleventy) using Parcel to process .pcss files. That's PostCSS — it does need to be processed. However, images used there, as in background-image: url("images/image.png") — don't. That's because Eleventy is set up to copy all static assets directly to dist/images/ and Parcel messes up the paths. And image optimisation is done manually, in PS.

As a temporary measure, I have to use absolute paths and hardcode http://localhost, then use another script to run during prod builds and rename that into real domain url...

If this challenge is somehow solved already (I saw vague comments on #144 alluding it's solved on Parcel v2), then documentation needs to address this — this ticket is a great way to track documentation tasks like that.

Personally, I'd solve this by adding a glob whitelist on asset paths. Parcel would still try to resolve as usual, but it would skip user-supplied glob paths. For example, in package.json, user would add parcel: { ignore: { "*/images/*" and all paths in .pcss that Parcel tries to resolve would get skipped. It's easy to make a program to skip operations, isn't it?

[hash-bang]

This is a blocking issue for us moving to Parcel too.

To give a really easy example assume the following HTML:

<img src="/assets/logo.svg"/>

Our web server handles the serving of everything from the /assets directory (properly cached and 304 handled). We don't want those resources bundling into Parcel but there is no way I can find of excluding them.

Having a glob list of excluding files as suggested by @revelt would be great.