π’ Node Emulation
Some features that ultimately emulate Node.js's API
ΒΆ π³ Environment Variables
Parcel uses dotenv to support loading environment variables from .env files.
.env files are to be stored alongside the package.json that contains your parcel-bundler dependency.
Parcel loads .env files with these specific names for the following NODE_ENV values:
valid .env filenames |
NODE_ENV=* |
NODE_ENV=test |
|---|---|---|
.env |
βοΈ | βοΈ |
.env.local |
βοΈ | βοΈ |
.env.${NODE_ENV} |
βοΈ | βοΈ |
.env.${NODE_ENV}.local |
βοΈ | βοΈ |
Notably:
NODE_ENVdefaults todevelopment..env.localis not loaded whenNODE_ENV=testsince tests should produce the same results for everyone- Sometimes introducing a new .env file will not work immediately. Try deleting the .cache/ directory in this case.
- Accessing the
process.envobject directly is not supported, but accessing specific variables on it likeprocess.env.API_KEYwill provide the expected value. - Use the built-in
processNode.js global, i.e. don't doimport process from "process". If you use TypeScript, you probably want to install@types/nodefor it to compile.
ΒΆ π³οΈ Polyfilling & Excluding Builtin Node Modules
When (or more likely a dependency) importing packages such as crypto, fs or process, Parcel will either automatically use one of the listed polyfills and otherwise exclude that module. You can use the aliases field in your package.json
| native module | npm replacement | native module | npm replacement |
|---|---|---|---|
| assert | assert |
process | process/browser.js |
| buffer | buffer |
punycode | punycode |
| console | console-browserify |
querystring | querystring-es3 |
| constants | constants-browserify |
stream | readable-stream |
| crypto | crypto-browserify |
string_decoder | string_decoder |
| domain | domain-browser |
sys | util/util.js |
| events | events |
timers | timers-browserify |
| http | stream-http |
tty | tty-browserify |
| https | https-browserify |
url | url |
| os | os-browserify/browser.js |
util | util/util.js |
| path | path-browserify |
vm | vm-browserify |
| zlib | browserify-zlib |
ΒΆ π Inlining fs.readFileSync
Calls to fs.readFileSync are replaced with the file's contents if the filepath is statically determinable and inside the project root
fs.readFileSync(..., "utf8"): with the contants as string with (or any other valid encoding)fs.readFileSync(...): a Buffer object (e.g.Buffer.from(....)together with the an potentionally necessary polyfill)
build index.jsimport fs from "fs";
import path from "path";
const data = fs.readFileSync(path.join(__dirname, "data.json"), "utf8");
console.log("data");
{
"foo": "bar"
}
ΒΆ π§ Disabling These Features
Inlining of environment variables and readFileSync calls can be disabled via a @parcel/transformer-js key in package.json:
{
"name": "my-project",
"dependencies": {
...
},
"@parcel/transformer-js": {
inlineFS: false,
inlineEnvironment: false
}
}
inlineEnvironment can also be an array of glob strings:
{
"name": "my-project",
"dependencies": {
...
},
"@parcel/transformer-js": {
inlineEnvironment: ["SENTRY_*"]
}
}
inlineFS applies to readFileSync calls and inlineEnvironment to process.env.SOMETHING:
{
inlineFS: boolean,
inlineEnvironment: boolean | Array<Glob>
}
(This functionality is provided by @parcel/transformer-js and @parcel/resolver-default.)