Skip to content

Commit

Permalink
Update description of node_modules handling (#297)
Browse files Browse the repository at this point in the history
* Update description of node_modules handling

Updates the Transforms page to be consistent with parcel-bundler/parcel#559 and parcel-bundler/parcel#1101.

* Improve wording

Configuration files outside of node_modules will never ever apply to things inside of node_modules
  • Loading branch information
Macil authored and DeMoorJasper committed Nov 14, 2018
1 parent a6d8cd5 commit 4aa4032
Showing 1 changed file with 47 additions and 2 deletions.
49 changes: 47 additions & 2 deletions src/i18n/en/docs/transforms.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,50 @@
# 🐠 Transforms

While many bundlers require you to install and configure plugins to transform assets, Parcel has support for many common transforms and transpilers built in out of the box. You can transform JavaScript using [Babel](https://babeljs.io), CSS using [PostCSS](http://postcss.org), and HTML using [PostHTML](https://github.com/posthtml/posthtml). Parcel automatically runs these transforms when it finds a configuration file (e.g. `.babelrc`, `.postcssrc`) in a module.
While many bundlers require you to install and configure plugins to transform assets, Parcel has support for many common transforms and transpilers built in out of the box. You can transform JavaScript using [Babel](https://babeljs.io), CSS using [PostCSS](http://postcss.org), and HTML using [PostHTML](https://github.com/posthtml/posthtml). Parcel automatically runs these transforms when it finds a configuration file (e.g. `.babelrc`, `.postcssrc`) in a module. (In addition to any transforms specified in `.babelrc`, Parcel always uses Babel on all modules to compile modern JavaScript into a form supported by browsers. See the [JavaScript/Default Babel Transforms](javascript.html#default-babel-transforms) section for more information.)

This even works in third-party `node_modules`: if a configuration file is published as part of the package, the transform is automatically turned on for that module only. This keeps bundling fast since only modules that need to be transformed are processed. It also means that you don't need to manually configure the transforms to include and exclude certain files, or know how third party code is built in order to use it in your application.
## Third-Party Modules

Configuration files (such as `.babelrc`) will not be applied to files inside third-party `node_modules` by default. However, if the module's directory is symlinked (as is common in some monorepo conventions) and the module's `package.json` has the `source` field set, then configuration files inside the module's directory will be respected. Here are the types of values supported by the `source` field:

* Treat all files as source code, don't change the resolution

```json
{
"main": "foo.js",
"source": true
}
```

* When compiling from source, use bar.js as the entry point

```json
{
"main": "foo.js",
"source": "bar.js"
}
```

* When compiling from source, alias specific files

```json
{
"main": "foo.js",
"source": {
"./foo.js": "./bar.js",
"./baz.js": "./yay.js"
}
}
```

* When compiling from source, alias using glob patterns

```json
{
"main": "foo.js",
"source": {
"./lib/**": "./src/$1"
}
}
```

The last example allows you to replace your entire lib directory with src so import 'my-module/lib/test.js' would resolve to 'my-module/src/test.js'. You could also use a top-level catch-all pattern like `"**": "./src/$1"` for packages like lodash that have many files in the root to replace (e.g. lodash/cloneDeep with lodash/src/cloneDeep).

1 comment on commit 4aa4032

@vercel
Copy link

@vercel vercel bot commented on 4aa4032 Nov 14, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.