โ package.json
The targets object in package.json
ยถ Fields
These are the fields that Parcel uses for its configuration:
ยถ main
/ module
/ browser
These are common fields used by other tools as well,
They default to library mode (meaning they don't bundle dependencies): (see also targets
)
main
(andmodule
) are the standard entry points to your library,module
defaults to ESM module output.browser
is intended for a browser-specific build (e.g. without some native features).
If one these fields is specified, Parcel will create a target for that field (no property in targets
is needed)
To make Parcel ignore one of these fields, specify false
in target.(main|browser|module)
:
If the browser
field is an object, package.json#browser[pkgName]
can be used instead of package.json#browser
.
ยถ custom targets
To create your own target (without any of the semantics of the common target described previously), add a top-level field with your target's name and output path. You also need to add it to targets
to make Parcel recognize that field.
ยถ source
Specify the entry points for your source code which gets mapped to your targets, can be a string or an array.
ยถ targets
Targets are configured via the package.json#targets
field.
{
"app": "dist/browser/index.js",
"appModern": "dist/browserModern/index.js",
"targets": {
"app": {
"engines": {
"browsers": "> 0.25%"
}
},
"appModern": {
"engines": {
"browsers": "Chrome 70"
}
}
}
}
Each target has a name which corresponds to a top-level package.json
field
such as package.json#main
or package.json#app
which specify the primary
entry point for that target.
Each of those targets contains the target's environment configuration (all of these properties are optional):
Option | Possible values | Description |
---|---|---|
context |
see below | In which runtime the bundles should run. |
distDir |
string |
Specify output folder (as opposed to output file) |
engines |
package.json#engines |
Higher priority than package.json#engines |
includeNodeModules |
see below | Whether to bundle all/none/some node_module dependencies |
isLibrary |
boolean |
Library as in "npm library" |
minify |
boolean |
Whether to enable minification (exact behaviour is determined by plugins). Set by --no-minify |
outputFormat |
'global' | 'esmodule' | 'commonjs' |
Which type of imports/exports should be emitted |
publicUrl |
string |
The public url of the bundle at runtime |
scopeHoist |
boolean |
Whether to enable scope hoisting Needs to be true for ESM and CommonJS outputFormat . Set by --no-scope-hoist |
sourceMap |
see below | Enable/disable sourcemap and set options. Overwritten by --no-source-maps |
However, a lot of the normal configuration for building a library is already provided by default for you:
targets = {
main: {
engines: {
node: value("package.json#engines.node"),
browsers: unless exists("package.json#browser") then value("package.json#browserlist")
},
isLibrary: true
},
module: {
engines: {
node: value("package.json#engines.node"),
browsers: unless exists("package.json#browser") then value("package.json#browserlist")
},
isLibrary: true
},
browser: {
engines: {
browsers: value("package.json#browserslist")
},
isLibrary: true
},
...value("package.json#targets"),
}
ยถ context
Possible values are 'node' | 'browser' | 'web-worker' | 'service-worker' | 'electron-main' | 'electron-renderer'
.
These values can be used by plugins (e.g. a service worker url should not contain a hash, a webworker can use importScripts
).
For the common targets, these are inferred from the target:
- The
main
target has the contextnode
if there isbrowser
target orengines.node != null && engines.browsers == null
, andbrowser
otherwise. - The
module
target has the contextnode
if there isbrowser
target andbrowser
otherwise. - The
browser
target has contextbrowser
.
ยถ includeNodeModules
This fields defaults to false
when isLibrary
is true. Possible values are:
false
: to include nonenode_modules
package- an
array
: a list of packages names or wildcards to include - an
object
:includeNodeModules[pkgName] ?? true
determines if it is included. (e.g.{ "lodash": false }
)
ยถ sourceMap
Can be a boolean (to simply enable / disable source maps) or an option (which is somewhat equivlant to true
):
Option | Default value | Description |
---|---|---|
inline | false |
Include the sourcemap as a data-url in the bundle (in the sourceMappingURL ) |
inlineSources | false |
Should the sourcemap contain the sources contents (otherwise, they will be loaded from ${sourceRoot}/$(name) ) |
sourceRoot | path.relative(bundle, pojectRoot) |
Essentially the public url for the sources |
The --no-source-maps CLI parameter sets the default value to false
(as opposed to true
).
ยถ engines
/ browserslist
These top-level fields set the default value for target.*.engines.browsers
and target.*.engines
, respectively.
Specifies the environment.
ยถ alias
ยถ Which package.json
is used when specifying multiple entries (packages)
All paths are relative to /some/dir/my-monorepo
.
cwd | entries | used pkg.json#* (fields described below) |
---|---|---|
.. |
packages/*/src/**/*.js |
package.json |
. |
packages/*/src/**/*.js |
package.json |
packages/ |
packages/*/src/**/*.js |
package.json |
packages/pkg-a |
packages/pkg-a/src/index.js |
packages/pkg-a/package.json |
packages/pkg-a/src |
packages/pkg-a/src/index.js |
packages/pkg-a/package.json |