title: Problems migrating React to SSR. import _extends from "@babel/runtime/helpers/esm/extends"
body: <p>So, I've been following a YouTube tutorial on how to migrate React to SSR, since I want to get my app in Google's crawler. This is the tutorial: <a href="https://www.youtube.com/watch?v=NwyQONeqRXA" rel="nofollow noreferrer">https://www.youtube.com/watch?v=NwyQONeqRXA</a>
  And this is the project: <a href="https://github.com/MerceneX/BoomMap/tree/development" rel="nofollow noreferrer">https://github.com/MerceneX/BoomMap/tree/development</a></p>
  
  <p>The difference is I'm using npm and the tutorial dude is useing yarn. Not sure if that makes a difference due to my lack of knowledge on this topic. I setup the server.js and index.js (this is not yet commited to the github due to it not working), and upon running <code>npm run ssr</code> which is set to run <code>node index.js</code> I get the following error message:</p>
  
  <pre><code>npm run ssr
  
  &gt; client@0.1.0 ssr D:\Projects\Webpages\BoomMap\clientTest
  &gt; node index.js
  
  D:\Projects\Webpages\BoomMap\clientTest\node_modules\reactstrap\es\Col.js:1
  (function (exports, require, module, __filename, __dirname) { import _extends from "@babel/runtime/helpers/esm/extends";
                                                                       ^^^^^^^^
  
  SyntaxError: Unexpected identifier
      at new Script (vm.js:79:7)
      at createScript (vm.js:251:10)
      at Object.runInThisContext (vm.js:303:10)
      at Module._compile (internal/modules/cjs/loader.js:657:28)
      at Module._compile (D:\Projects\Webpages\BoomMap\clientTest\node_modules\pirates\lib\index.js:99:24)
      at Module._extensions..js (internal/modules/cjs/loader.js:700:10)
      at Object.newLoader [as .js] (D:\Projects\Webpages\BoomMap\clientTest\node_modules\pirates\lib\index.js:104:7)
      at Module.load (internal/modules/cjs/loader.js:599:32)
      at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
      at Function.Module._load (internal/modules/cjs/loader.js:530:3)
  </code></pre>
  
  <p>The server.js and index.js are the same as the tutorial, but to ball everything in one place, here they are:<br>
  <strong>index.js:</strong></p>
  
  <pre><code>require("ignore-styles");
  
  require("@babel/register")({
      ignore: [/(node_module)/],
      presets: ["@babel/preset-env", "@babel/preset-react"],
  });
  
  require("./server");
  </code></pre>
  
  <p><strong>server.js:</strong></p>
  
  <pre><code>import express from "express";
  import fs from "fs";
  import path from "path";
  
  import React from "react";
  import ReactDOMServer from "react-dom/server";
  import App from "./src/App";
  
  const PORT = 3005;
  
  const app = express();
  
  app.use("^/$", (req, res, next) =&gt; {
      fs.readFile(path.resolve("./build/index.html"), "utf-8", (err, data) =&gt; {
          if (err) {
              console.log(err);
              return res.status(500).send("Error reading build");
          }
          return res.send(
              data.replace(
                  '&lt;div id="root"&gt;&lt;/div&gt;',
                  `&lt;div id="root"&gt;${ReactDOMServer.renderToString(&lt;App /&gt;)}&lt;/div&gt;`
              )
          );
      });
  });
  
  app.use(express.static(path.resolve(__dirname, "build")));
  
  app.listen(PORT, () =&gt; {
      console.log(`App launched on localhost:${PORT}`);
  });
  </code></pre>
  
  <p>I have no clue what to do here, as the error is coming from a reacstrap library. Conflict of dependencies maybe?</p>
  
  <p>Anyways, if anyone has a better idea on how to get a website to SSR or any other method to get it crawled by Google, I'm very much looking for advice :)</p>
  
  <p>Thanks for reading this, cheers.</p>