Search code examples
javascriptnode.jsreactjsbabeljsbabel-cli

Babel with .babelrc how to fix MODULE_NOT_FOUND?


Babel is telling me a plugin does not exist when it does. (I can compile fine with babel-cli, but that does not support setting pragma options. So I am left to use disgusting .babelrc file) What am I doing wrong here ?

.babelrc

{
    "plugins": [
        "babel-plugin-redom-jsx",
        ["@babel/plugin-transform-react-jsx", {
            "pragma": "el"
        }]
    ]
}

npx babel frontend.js

{ Error: Cannot find module 'babel-plugin-redom-jsx' from '/home/user/Documents/my_program'
    at Function.module.exports [as sync] (/home/user/Documents/my_program/node_modules/resolve/lib/sync.js:58:15)
    at resolveStandardizedName (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/files/plugins.js:101:31)
    at resolvePlugin (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/files/plugins.js:54:10)
    at loadPlugin (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/files/plugins.js:62:20)
    at createDescriptor (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/config-descriptors.js:154:9)
    at items.map (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/config-descriptors.js:109:29)
    at createPluginDescriptors (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/config-descriptors.js:105:10)
    at plugins (/home/user/Documents/my_program/node_modules/@babel/core/lib/config/config-descriptors.js:40:19) code: 'MODULE_NOT_FOUND' }

package.json :

{
  "devDependencies":
   {
    "@babel/cli": "^7.2.3",
    "@babel/core": "^7.2.2",
    "@babel/plugin-transform-react-jsx": "^7.3.0",
    "@babel/preset-env": "^7.3.0",
    "babel-plugin-transform-redom-jsx": "^2.0.0",
    "babel-preset-minify": "^0.5.0",
    "babelify": "^10.0.0",
    "browserify": "^16.2.3",
    "redom": "^3.18.0",
    "terser": "^3.14.1"
   }
}

Solution

  • It looks like there is a typo in the docs, as you can check your node_modules folder and you should see babel-plugin-transform-redom-jsx. So your .rc should look like:

    {
      "plugins": [
        "babel-plugin-transform-redom-jsx",
        ["@babel/plugin-transform-react-jsx", {
          "pragma": "el"
        }]
      ]
    }