How to ignore the parent "src" directory when transpiling using Babel watcher

Question

My code has the directory structure:

project-root/
└── src/
    └── main.js

When I run the default Babel file watcher, the code is transpiled into a dist folder, including the src directory in it's path, like so:

project-root/
└── src/
    ├── main.js
    dist/
    └── src
        └── main.dist.js

What I want instead is for the src to be excluded from the path - in other words, for the transpiled code in src to be "unwrapped" and compiled straight into dist, like the following:

project-root/
└── src/
    ├── main.js
    dist/
    └── main.dist.js

Is it be possible to change the watcher config to achieve this? I can't figure it out! Any help is much appreciated.

score 1 · Accepted Answer · answered Jun 20 '18 at 17:45

it's the --out-dir Babel CLI option behavior - it recreates the source folder structure (relative to working dir) in the destination directory.

You have 2 options here:

use --out-file instead
set src as your working directory

Possible setup for the first option:

Arguments: $FilePathRelativeToProjectRoot$ --out-file dist/$FileNameWithoutExtension$.js --source-maps --presets env
Output paths to refresh: dist\$FileNameWithoutExtension$.js:dist\$FileNameWithoutExtension$.js.map

For the second:

Arguments: $FileDirPathFromParent(src)$$FileName$ --out-dir $ProjectFileDir$/dist --source-maps --presets env
Output paths to refresh: $ProjectFileDir$/dist/$FileDirPathFromParent(src)$FileNameWithoutExtension$.js:$ProjectFileDir$/dist/$FileDirPathFromParent(src)$FileNameWithoutExtension$.js.map
Working directory: $ContentRoot$\src

How to ignore the parent "src" directory when transpiling using Babel watcher

1 Answers1