title: How to get babelify 10 to target a browser
body: <p>What I want is</p>
  
  <ol>
  <li>To be using the latest versions of the libraries.</li>
  <li>For it to run in IE 11.</li>
  </ol>
  
  <p>I'm building a react app and in order to run the tests I need @testing-library/react. In order to run the tests in a browser I need browserify. In order to run the tests in every browser I support I need babelify. However no matter what I try the babelify does nothing (and IE 11 doesn't support ... or => syntax it generates).</p>
  
  <p>Here's the relevant part of package.json (some dependencies are likely not needed):</p>
  
  <pre class="lang-js prettyprint-override"><code>      "dependencies": {
            "@babel/cli": "^7.8.4",
            "@babel/core": "^7.9.6",
            "@babel/plugin-proposal-class-properties": "^7.8.3",
            "@babel/plugin-transform-arrow-functions": "^7.8.3",
            "@babel/polyfill": "^7.8.7",
            "@babel/preset-env": "^7.9.6",
            "@babel/preset-react": "^7.9.4",
            "@testing-library/react": "^10.0.4",
            "babelify": "^10.0.0",
            "browserify": "^16.5.1",
            "react": "^16.13.1",
            "react-dom": "^16.13.1"
          },
          "browserslist": [
            "IE 11"
          ]
  </code></pre>
  
  <p>The code that looks like it should work:</p>
  
  <pre class="lang-js prettyprint-override"><code>    require('browserify')({
         entries: ['./node/ReactUtil.js']
      })
      .transform("babelify", {
         presets: [['@babel/preset-env', {"targets": {
            "browsers": ["ie &lt; 8"]
         }}]]
      })
      .bundle()
      .pipe(fs.createWriteStream("javascript/generated/ReactUtil.js"));
  </code></pre>
  
  <p>I've tried the string babelify and require("babelify"). I've tried require("babelify").configure. I've tried having a file named babel.config.json, .babelrc, and .babelrc.json in the working directory. I've tried babel.config.js in the working directory (which has a different format). (The contents of these files have been excluded to prevent tl;dr).</p>
  
  <p>The generated file isn't different (or is empty) and there's no error. The only thing that gave me an error was:</p>
  
  <pre class="lang-js prettyprint-override"><code>    .transform('babelify', {
         "presets": [
            [
               "env",  //Error: Cannot find module 'babel-preset-env'. Did you mean "@babel/env"?
               {
                  "targets": {
                     "browsers": [
                        "ie &lt; 8"
                     ]
                  }
               }
            ]
         ]
      })
  </code></pre>
  
  <p>So I changed the "env" to "@babel/env" and babelify did nothing... The transform can't come after bundle or pipe and if I try running @babel/core after this (output a different file name) there's a race condition because browserify hasn't finished writing the file yet.</p>
  
  <p>I wouldn't be totally opposed to switching tools but I figured that babelify should be able to work as expected. Maybe babelify doesn't support the newer versions I'm on? I couldn't find documentation for babelify targeting a browser and examples/other stack overflow are old or didn't work. There's too many possible combinations to try. Note that this works fine in Chrome so the browserify part is working fine.</p>