title: Typescript/Node Unexpected token *
body: <p>I'm trying to update my app node backend to typescript and I keep hitting this syntax error:</p>
  
  <pre><code>/Users/Shared/website/src/server.ts:1
  (function (exports, require, module, __filename, __dirname) { import * 
  as express from 'express';
                                                                   ^
  
  SyntaxError: Unexpected token *
  </code></pre>
  
  <p>I have my tsconfig/webpack/server, etc set up as follows:</p>
  
  <p><b>server.ts</b></p>
  
  <pre><code>import * as express from 'express';
  import * as path from 'path';
  
  const app = express();
  const port = process.env.PORT || 3000;
  
  app.use(express.static(path.join(__dirname, 'dist')));
  app.get('*', function(req, res, next){
      res.sendFile(path.resolve(__dirname, '/public', 'index.html'));
  });
  
  app.listen(port, () =&gt; console.log(`Listening on port ${port}!`));
  </code></pre>
  
  <p><b>webpack.config.json</b>:</p>
  
  <pre><code>const path = require('path');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  const CleanWebpackPlugin = require('clean-webpack-plugin');
  const CopyWebpackPlugin = require('copy-webpack-plugin');
  
  const outputDirectory = 'dist';
  
  module.exports = {
      entry: "./src/index.tsx",
      output: {
          filename: "bundle.js",
          path: path.join(__dirname, outputDirectory)
      },
      mode: 'development',
  
      // Enable sourcemaps for debugging webpack's output.
      devtool: "source-map",
  
      resolve: {
          // Add '.ts' and '.tsx' as resolvable extensions.
          extensions: [".ts", ".tsx", ".js", ".json"]
      },
  
      module: {
          rules: [
              // All files with a '.ts' or '.tsx' extension will be handled by 'awesome-typescript-loader'.
              { test: /\.tsx?$/, loader: "ts-loader" },
  
              // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
              { enforce: "pre", test: /\.js$/, loader: "source-map-loader" },
  
              {
                  test: /\.scss$/,
                  use: [
                      "style-loader", // creates style nodes from JS strings
                      "css-loader", // translates CSS into CommonJS
                      "sass-loader" // compiles Sass to CSS, using Node Sass by default
                  ]
              }
          ]
      },
  
      // When importing a module whose path matches one of the following, just
      // assume a corresponding global variable exists and use that instead.
      // This is important because it allows us to avoid bundling all of our
      // dependencies, which allows browsers to cache those libraries between builds.
      externals: {
      },
  
      plugins: [
          new CleanWebpackPlugin([outputDirectory]),
          new HtmlWebpackPlugin({
            template: './public/index.html',
            favicon: './public/favicon.gif'
          }),
          new CopyWebpackPlugin([
              { from: 'public' }
          ])
      ]
  };
  </code></pre>
  
  <p><b>tsconfig.json</b>:</p>
  
  <pre><code>{
      "compilerOptions": {
          "outDir": "./dist/",
          "sourceMap": true,
          "noImplicitAny": false,
          "module": "commonjs",
          "target": "es6",
          "jsx": "react"
      },
      "include": [
          "./src/**/*"
      ],
  }
  </code></pre>
  
  <p>The build process succeeds, but I hit the syntaxError on run. I have a react front end also set up using typescript / tsx and it works just fine. I seem to just be running into issues with the server.ts / node files. I'm very new to trying to get this all set up, but I wanted practice making a site with numerous technologies (react/node/typescript/sass/webpack/etc). So far I have everything except the typescript/node relationship.</p>