Hacker News Reader

Comment by joshstrange | Hacker News Reader

I won't pretend tsconfig/webpack or any other bundler out there is "fun" to work with but once I get my TS support working in a project it is a joy to write in TS. I already liked JS (if that didn't make you hate me I like PHP too and have gotten paid to write it for a decade now) but TS really pushed me over the top.

I avoided TS like the plague because I didn't want another layer added in and I thought it was just coffeescript++ but after taking the plunge on 6to5 (renamed to babel) because "well these features are coming to JS soon anyway or have already landed in stable browsers" it was just a hop, skip, and a jump over into TS (in for a penny...). Modern JS is actually really fun to work in and TS takes to the next level with peace of mind I never had with just JS.

View on HN

> I won't pretend tsconfig/webpack or any other bundler out there is "fun" to work with

For me, Parcel is fun to work with. Rollup is my favorite for more advanced or customized pipelines, but Parcel has a silky smooth workflow for the typical bundling tasks in most projects. I've started using it for Node.js as well (since I want to avoid ts-node) but it seems best for frontend-only projects and components. Speaking as someone who has managed to avoid Webpack thus far despite its status as the "industry standard".

do you have any guide on how to setup,TS, linters etc with Parcel?

The whole point of Parcel is that you basically can't configure it. TS should just work.

Rollup is basically a configurable Parcel.

Look into esbuild as well. It falls somewhere in between Parcel and Rollup in terms of configuration options but it's way faster (around 10x compared to Rollup for my tests) than either.

last time I tried to use Rollup, I found that it was very focused on NodeJS libs rather than frontend projects where Webpack (or other tools that bill themselves as "bundlers") is used more often. After a few "oh, rollup doesn't do that by default, guess I need this plugin"-situations, I switched back to Parcel.

Has that changed? Was I just not using it right or didn't read the right rollup-for-the-web documentation?

Rollup isn't focused on node, if it was commonJS support would be bundled into the code.

It's got a small and focused core that aims for esm (I regard the other output formats supported as esm -> that format).

You do need to plug stuff in rather than having a batteries included experience. But that is a strength imo where you want to worry only about what you need.

I do recommend adapting an existing config when using it in a new project, or creating your own templates/"create-x-app" wrapper.

I use it for my home projects, and several work ones. It's "lower level" than Babel or parcel but that means I can set it up to compile both a lean, modern esm build, and a legacy IE11 compatible polyfilled systemJS bundle much easier than I can in webpack with its proprietary bundle format or parcels zero config.

I will admit that node resolve and commonJs rollup plugins are pretty much a required part to work within the npm ecosystem right now, so it is a bit more boilerplate-y than I'd like.

Thanks for noting this -- I ought to give it another try in the near future.

I use NodeJS exclusively for running Rollup (I'm using Rust for the back-end), and I use Rollup exclusively for the front-end bundling (TS, SCSS, Babel, SVGO, minifiers).

Have a look at the Svelte templates, they all use Rollup. Configuring Rollup is far more straightforward than Webpack and source maps just work. I'm pretty sure you'll like it.

I need to give it another try -- I end up separating my front and backend codebases completely so while I don't have to worry about mixing, I did find that Rollup was more complicated than Parcel so I just went with Parcel.

Out of curiosity, what are you using as your HTTP server library/framework for Rust? At this point I've used a bunch of them (maybe 3/6+ that are out there) and am curious what others are using.

What I've tried for this project (in chronological order):

* Gotham. Pros: very clean. Cons: lots of boilerplate code.

* Actix-web: Pros: very little happy-path boilerplate code. Fastest framework right now. Cons: error handling is just awful - I struggled to get `?` to work. Glacial compilation times.

* Rocket (0.5 direct Git dependency). Pros: route handlers almost entirely consist of logic I care about, even for errors. Feels very deliberately "rusty." Cons: no HTTP2. No websockets. It has been accused of being "too magic."

Each resulted in a ~20% reduction in LOC. I tend toward getting shit done, so I'm over the moon with Rocket.

Thanks for sharing -- for me:

* actix-web:

  Pros: good docs, well supported, good eco system, Actor model fits very well with how I build systems (Actor ~= Component)

  Cons: some ceremony around setup of the app object

* tower-web

  Pros: good ergonomics, much easier to wrangle app state

  Cons: all-in-one macro is a bit hard to reason about, hard to split up bits of API (I might have just not known enough about how to break up the impl_web! macro)

* warp Pros: express-y (req, resp) => result interface, surprisingly feature complete (http2, sse, websockets) due to building off of simple interfaces/extension points, functional APIs that are easy to compose

  Cons: very new, kind of experimental, docs are a little lacking but examples help

That hasn't been my experience at all, in fact recent tools such as vite and snowpack are built on using rollup for frontend projects. You do need to install the plugins you want to use as they aren't all available out of the box, but generally I haven't had any troubles and basically just stick to the official plugins.

From what I can tell, Parcel v1 does not have linting, but I rely on linting and typechecking in my editor anyway, so I didn't notice. It's actually pretty handy to bypass typechecking and write untyped JS to quickly check if something will work then add types to it gradually. VS Code yells at me until I fix it, so it doesn't go unfixed.

https://parceljs.org/ is the homepage. Run the command (or put the command in an npm script) like `parcel whatever.ts` and it will output your bundle with all dependencies transpiled to JS and CSS. The simplicity does come at a cost; it's not as readily customizable as something like Rollup. I've been eagerly tracking v2 and it appears they are adding linting and much more into Parcel.

Yeah I had the same issue and have been following the Typescript thread on GH for a while now [1]. But I agree, I actually like using untyped JS for development.

What I do now is throw a "tsc --noEmit" call before tests/prod build to type everything before parcel runs. Works well enough.

[1] https://github.com/parcel-bundler/parcel/issues/4022

Reply on news.ycombinator.com