Parcel: 2.0 `--out-dir` equivalent

[ndarilek]

Apologies if this is already supported--I couldn't find it after a brief documentation check.

I'm using Parcel to bundle dependencies for an Elixir/Phoenix app. This involves bundling JS/CSS out of an assets/ folder, wherein package.json/yarn.lock are found, into ../priv/static. For Parcel 1, I can add --out-dir ../priv/static and things work fine. Under 2, there doesn't appear to be any obvious way to put things in a folder other than dist/.

Granted, I can copy files from that destination manually, but my package.json scripts are already a bit long. Any chance we can have --out-dir, or documentation for its current equivalent?

Thanks for Parcel.

[mischnic]

--dist-dir

(WIP migration docs: https://parcel2-docs.now.sh/getting-started/migration/)

[ndarilek]

Cool, any chance that can at least be added to the --help output before
this is considered closed? Or did I somehow miss it? I looked for any
option that might do the trick, and never saw that one.

Thanks.

[mischnic]

$ parcel build -h
Usage: build [options] [input...]

bundles for production

Options:
  --no-minify                disable minification
  --no-scope-hoist           disable scope-hoisting
  --public-url <url>         the path prefix for absolute urls
  --no-cache                 disable the filesystem cache
  --cache-dir <path>         set the cache directory. defaults to ".parcel-cache"
  --no-source-maps           disable sourcemaps
  --no-autoinstall           disable autoinstall
  --target [name]            only build given target(s) (default: [])
  --log-level <level>        set the log level, either "none", "error", "warn", "info", or "verbose".
  --dist-dir <dir>           output directory to write to when unspecified by targets
  --profile                  enable build profiling
  -V, --version              output the version number
  --detailed-report [depth]  Print the asset timings and sizes in the build report
  -h, --help                 output usage information

[ndarilek]

Oh, I think I ran parcel and not parcel2. My mistake.

[mischnic]

Sorry, parcel2 is from my dev envionment. yarn add parcel gives you the parcel binary.

[dacodekid]

@mischnic - Is there any reason, --dist-dir option (or any output option) been removed from 2.0.0-alpha.3.2 CLI? I only see the following options and --dist-dir isn't working.

Options:
  --no-minify          disable minification
  --no-scope-hoist     disable scope-hoisting
  --no-cache           disable the filesystem cache
  --cache-dir <path>   set the cache directory. defaults to ".parcel-cache"
  --no-source-maps     disable sourcemaps
  --no-autoinstall     disable autoinstall
  --target [name]      only build given target(s) (default: [])
  --log-level <level>  set the log level, either "none", "error", "warn", "info", or "verbose".
  --profile            enable build profiling
  -V, --version        output the version number
  -h, --help           output usage information

The only way to make it work in this version was - to add targets in package.json

  "browserModern": "static/dist/index.js",
  "targets": {
    "browserModern": {
      "engines": {
        "browsers": [
          "last 1 Chrome version"
        ]
      }
    }
  }

[mischnic]

It was added back in parcel@nightly and renamed to --dist-dir (there will be a new alpha soon).

[apiel]

Hello, I can't get --dist-dir working.

I ran yarn add parcel@nightly
Now I try the following command yarn parcel build --dist-dir ./site/static ./tmp/bundle/index.js

But as output, I get:

✨ Built in 1.17s

dist/lib.js     1.91 KB    661ms
dist/lib.css       78 B    660ms
Done in 1.58s.

Is there something more to do to get it work?

[mischnic]

Works for me:

niklas@nmb:nightly $ yarn add parcel@nightly
...
niklas@nmb:nightly $ mkdir -p tmp/bundle
niklas@nmb:nightly $ echo "console.log(1);" >  tmp/bundle/index.js
niklas@nmb:nightly $ yarn parcel build --dist-dir ./site/static ./tmp/bundle/index.js
yarn run v1.22.4
warning package.json: No license field
$ .../node_modules/.bin/parcel build --dist-dir ./site/static ./tmp/bundle/index.js
✨ Built in 5.92s

site/static/index.js    50 B    959ms
✨  Done in 6.96s.

[apiel]

Ok, I found out the problem. It is because inside my package.json I have "main": "dist/lib.js",. Shouldn't the --dist-dir overwrite the setting in package.json?

[mischnic]

No, because that wouldn't work once you specify multiple targets (which could overwrite themselves with same distdir)

[apiel]

Is it possible to say parcel to ignore all the settings in package.json?

[mischnic]

To ignore "common target fields" like the main field that you posted above:

{
    "main": "dist/lib.js",
    "targets": {
        "main": false
    }
}

[apiel]

Right but it is still base on package.json. In general your opiniated approach to make the config base on package.json make lot of sense and is easy.
But to be able to use parcel inside a tool will be very diffcult because then we would have to say the users of those tools that they are not able to do many thing with the package.json and to follow many rules to don't break parcel build. Therefor those tools might have some unwanted side effect if the user mess around with his package.json.
For example, if create-react-app would use parcel, it would be so easy for the user to break the build.

Maybe parcel is then not the right bundler to make such things :-/ but since I really like it, I still give a try.

(by the way, big thx for the super fast answer, you are amazing)

[mischnic]

If you are using Parcel 2 via the API (https://parcel2-docs.now.sh/features/parcel-api/), you can pass a targets (essentially the same as package.json#targets) object. In that case, Parcel won't use the package.json for the targets detection.
(Though there have been thoughts about removing this option since it makes caching rather difficult.)

[apiel]

Oooh god i was searching for this docs :-D I was starting to look at node_modules/parcel/src/cli.js to see if can use the api somehow but now with the doc, it will be much easier :p Thx, I will have look and see how I can deal with my stuff ;-) Hopefully, I find my way.