Support for multiple entry points.

[xgz123]

Does it support multiple page ? or only single page ?

[DeMoorJasper]

In theory it should support multiple pages, as long as they are linked from the startpoint.
Multiple entrypoints is not supported (yet)

[xgz123]

I'd like to work on this feature.

[jamiebuilds]

@xgz123 I'm assuming you didn't mean to close this? Do you want to add support for multiple entry points in Parcel?

[xgz123]

@thejameskyle yes.Thanks.

[kolya-ay]

Guys, please, make it possible to specify not just htmls as entry points but styles and js files too. There are circumstances when you don't want to allow your htmls to be touched by build tool. This is somewhat unachievable by Webpack so it could be killer feature;)

I believe that all the resources should be first-class to be treated consistently, otherwise we'll end up with a set of hacks in every non default case.

[DeMoorJasper]

@kolya-ay just point it to the js or css and it should work as well

[davidnagli]

@xgz123 What’s the progress on this?

[davidnagli]

Here’s what the syntax should look like for multiple entry points:

parcel file1.html file2.html file3.js

Notice that the entry points can have different asset types (file3.js)

[devongovett]

Is this actually necessary? I'm curious about the usecase. Can you just run parcel more than once?

[davidnagli]

If you think about it, the majority of large websites have multiple entry points, so this is a feature that a lot of people will need for big websites. As far as I see, running the command multiple times has 2 drawbacks: 1. It’s annoying and messy. 2. If Parcel knows about the other entry points, it can share all the common files and very efficiently share everything between the two bundles and prevent duplicate work. We would be losing out on a huge performance opportunity, and making people’s lives harder.

[zeakd]

my project works with two react-redux apps connect with window.open.
Bundling is also useful when make static pages.

in case React, I think SPA is just one of several ways using React. they are designed as view libraries, so it doesn't matter containing multiple react, redux app in one page or using server-side routing instead of react-router. They can have many entry point, but running parcel for each page is inefficient.

I'm working on static page builder with parcel. webpack was not fit to build static page because entry point can be only js file. I hope all pages running on one port and not to add each page to npm script when I make new html page. I think parcel should support glob.

[xgz123]

@davidnagli no progress for now... I tried to read the source code and need more time to fully understand how it works. Is there any instructions? I will try, but not sure how long it would take

[davidnagli]

Ok, great!

Feel free to contact either me or @DeMoorJasper on slack so we can help you understand what exactly you would need to do, or if you have any questions about how Parcel works :)

[kolya-ay]

If this happens, then "zero configuration" is no longer true, in my opinion

@brandon93s I'd argue, think of it as a shorthand for command line args. Good defaults could make parcel suitable for most common cases. One command to get up and running, awesome! However if there would be no place to store configs people will end up writing wrappers in more complicated scenarios.

And furthermore, configs shouldn't necessary be a set of horrible hacks (yeah, I'm looking at one of the most popular builders) and ether be gulp-style. Good design allows keep it declarative babelrc-style.

[davidnagli]

No I disagree with the whole non-zero-config thing, it kind of defeats the point.

Can we make a separate RFC to discuss that? It seems like everybody has their own opinions on this, but I don’t think it should get into the way of adding new features.

[davidnagli]

For now I think we should move forward with making the CLI version of multiple entry points, and eventually discuss adding support for config-based multiple entry points once we reach a consensus on the whole config thing.

[Munter]

In assetgraph-builder we do the same thing with just taking all non-option command line arguments as entry points. That works perfectly fine. And there are lots of use cases.

• 404.html, nobody ever links to it, but almost everyone needs it.
• 200.html, client side routing
• Campaign funnels, which usually don't have links to them, but are social media or advertisement links into the page

[atsolberg]

One major use case is large apps/sites where all the routing is in the backend. It's just not feasible to move all that routing to the client to convert to a spa. My only options are to serve all client side code for every page in a single file, or use webpack since it supports multiple entry files.

[ipmb]

Is this actually necessary? I'm curious about the usecase. Can you just run parcel more than once?

Not on the same port.

My use case is that I generate HTML dynamically using a different server (Django). I could tell Django to serve static files from localhost:1234 if parcel had a feature like this (and #557 lands).

The workaround is to create a dummy index.html which just has links to the files I want to build/watch.

[devongovett]

OK, let's do this. But first, let's nail down exactly how it would work.

• For each entry point, would we produce a separate output? Or merge them together somehow (e.g. by type - HTML together, JS together)? I think separate is probably more useful.
• Would we hoist common dependencies between entry points into a common bundle, or repeat them in each output bundle? Not sure which is more useful.

[tailhook]

For each entry point, would we produce a separate output? Or merge them together somehow (e.g. by type - HTML together, JS together)? I think separate is probably more useful.

I'm pretty sure separate output is expected. I.e. the whole point of separate JS entry point is to run different init code (i.e. mounting a different root view). And I don't even understand what merging HTML means. Am I missing something?

Would we hoist common dependencies between entry points into a common bundle, or repeat them in each output bundle? Not sure which is more useful.

Sure. Hoisting is the most important feature that makes it different from separate invocation: parcel x && parcel y

[TheFirstLairron]

I have an interest in this feature, and would be willing to help out on the implementation(time permitting). Just let me know!

[devongovett]

Awesome, @TheFirstLairron! Let me know if you need any help. Feel free to jump into our slack (http://slack.parceljs.org) and ask questions there.

[TheFirstLairron]

It looks like I won't actually have much time to dedicate to this for a while. I'm still going to try(at least as a learning exercise with what little time I have) but if anyone that is more familiar with the code base wants to pick this up, feel free to. I don't want to hold back this feature.

[xgz123]

@TheFirstLairron same here. I dont have much personal time recently ...

[jsiebern]

Would we hoist common dependencies between entry points into a common bundle, or repeat them in each output bundle? Not sure which is more useful.

I'd say that a flag / plugin / option would be good to define wether or not this is active, or even a configureable option like commons: [ 'react', 'jquery', 'moment' ] or something like that. It is quite configurable with webpack (I realize that this isn't what parcel is going for of course!). But maybe getting the basis going so that a plugin can be written to configure the common chunk behavior.

[radix]

Hi, I have a use case related to this issue that I would like to mention.

I, too, have multiple HTML files in my app, but the twist is that they are generated from a template with different parameters passed per entry point.

In webpack, I achieve this like so:

    plugins: [
      new HtmlWebpackPlugin({
        filename: build_dir + '/GM.html',
        template: 'src/react-template.ejs',
        rpi_url: env.rpi_url,
        pt_app: 'GM',
      }),
      new HtmlWebpackPlugin({
        filename: build_dir + '/Player.html',
        template: 'src/react-template.ejs',
        rpi_url: env.rpi_url,
        pt_app: 'Player',
      }),
    ]

As you can see, I share the react-template.ejs and just pass a different pt_app variable to the template for each different HTML file.

It seems this should be related to this ticket, but if the maintainers think this is separate enough of a requirement, I can file another ticket.

[devongovett]

Just opened #1119 to resolve this issue. It supports passing a list of files or globs to Parcel rather than just a single entry point.