Babel-CLI -- Using a package.json file to "watch" a directory does not update the compiled source

820 views Asked by At

The goal here is to watch a directory and output the new files.

When saved it should ....

  1. take every file in the directory and minify it
  2. transpile every file that needs transpiling
  3. add the minified file and the map in the same directory

What's actually happening ....

  1. message displays that files were compiled
  2. the .min "new" version of the file is not updated or changed and stays the same

Here's the package.json file

{
  "name": "theme",
  "version": "1.0.448",
  "description": "Someones Theme",
  "main": "index.php",
  "dependencies": {
    "@babel/plugin-transform-react-jsx": "^7.12.7",
    "@babel/polyfill": "^7.12.1",
  },
  "devDependencies": {
    "@babel/cli": "^7.12.8",
    "@babel/core": "^7.12.9",
    "@babel/preset-env": "^7.12.7",
    "@babel/runtime": "^7.12.5",
    "babel-preset-minify": "^0.5.1"
  },
  "scripts": {
    "watch:babel-blocks": "npx babel blocks/jsxblock/*.jsx --watch --out-dir blocks/jsxblock/ --out-file-extension .min.js --source-maps"
  },
  "author": "Someone",
  "license": "GPL-3.0-or-later"
}

Here's the .babel.config.json file

{
  "plugins": [
    "@babel/plugin-transform-react-jsx"
  ],
  "presets": [
    "@babel/env",
    "minify"
  ]
}

UPDATE - 12/2/2020

Here's a link to a repl.it demo

https://repl.it/join/xldfgzre-juandahveed

If you've never used repl.it before, make sure you hit control + shift + s so that the terminal will come up.

Then you can run npm run watch:babel-blocks and see what happens.

In this instance, if you update the blocks/jsxblock/editor.jsx file, the watch flag will actually work, and the blocks/jsxblock/editor.min.js file will update with any changes you make.

The only thing I can think of, is that in my local instance ( which is really just a hyped up WordPress site with a build script ) I am using both the devDependencies and dependencies areas of my package.json file, whereas with repl.it I can only have things be in the dependencies. I did test this in my local environment and it did not fix anything.

Thoughts? Suggestions? Does anyone actually know the reason why?

0

There are 0 answers