title: How to force TypeScript to not compile to JS when I have an error, with Webpack Encore setup
body: <p>I'm using Webpack Encore in my project to compile TypeScript to JavaScript. The setup is working perfectly, but I would like my watch/build command to break, when I have an error in my TypeScript code.
  Now I know that in a TS project I would have to set <strong>"noEmitOnError": true</strong> in my <strong>tsconfig.json</strong>'s <strong>compilerOptions</strong> object.</p>
  
  <p>Right now my webpack.config.js looks like this.</p>
  
  <pre><code>const Encore = require('@symfony/webpack-encore');
  const babelLoader = {
      test: /\.js$/,
      loader: 'babel-loader',
      query: {
          presets: [
              [
                  "@babel/preset-env",
                  {
                      "useBuiltIns": "entry",
                      "corejs": {version: 3, proposals: true}
                  },
              ]
          ]
      }
  };
  
  Encore
      .setOutputPath('public/build/')
      .copyFiles({
          from: './assets/images',
          to: 'images/[path][name].[hash:8].[ext]'
      })
      .setPublicPath('/build')
      .cleanupOutputBeforeBuild()
      .enableVersioning()
      .enableSourceMaps()
      .addEntry('app', './assets/ts/app.ts')
      .addEntry('admin', './assets/ts/admin/app.ts')
      .enableTypeScriptLoader()
      .enableForkedTypeScriptTypesChecking()
      .addLoader(babelLoader)
      .enablePostCssLoader()
      .enableSassLoader((options) =&gt; {
          options.outputStyle = 'compressed';
      })
      .enableSingleRuntimeChunk()
      .splitEntryChunks();
  
  const config = Encore.getWebpackConfig();
  
  // needed for Vagrant VM for watch mode to work correctly
  config.watchOptions = {
      poll: true
  };
  
  module.exports = config;
  </code></pre>
  
  <p>The lines responsible for TS compilation are</p>
  
  <pre><code>.enableTypeScriptLoader()
  .enableForkedTypeScriptTypesChecking()
  </code></pre>
  
  <p>According to <a href="https://symfony.com/doc/current/frontend/encore/typescript.html" rel="nofollow noreferrer">WebPack Encore's docs</a> the <em>enableForkedTypeScriptTypesChecking</em> method should make Encore use my <em>tsconfig.json</em>.</p>
  
  <p>My tsconfig.json looks like this:</p>
  
  <pre><code>{
    "compilerOptions": {
      "target": "es6",
      "module": "commonjs",
      "noImplicitAny": true,
      "removeComments": true,
      "preserveConstEnums": true,
      "sourceMap": true,
      "noEmitOnError": true
    },
    "files": [
      "core.ts",
      "sys.ts",
      "types.ts",
      "scanner.ts",
      "parser.ts",
      "utilities.ts",
      "binder.ts",
      "checker.ts",
      "emitter.ts",
      "program.ts",
      "commandLineParser.ts",
      "tsc.ts",
      "diagnosticInformationMap.generated.ts"
    ]
  }
  </code></pre>
  
  <p>So I have <strong>"noEmitOnError": true</strong> in my compiler options. But then when I make a deliberate error in my TS code (eg.: remove an argument from a function call) - which also gets correctly highlighted in my IDE as an error - then I run either <strong>encore dev</strong> or <strong>encore prodcution</strong>  then my build passes and I see the compiled, bundled JS files in my build directory.</p>
  
  <p>Also I have the compilation target set to ES6, but when I look into my compiled bundles, I see that all my <strong>let</strong> and <strong>const</strong> variable declarations got transpiled to ES5 compatible <strong>var</strong> statements.</p>
  
  <p>So it seems that TS compiler is ignoring what I tell it in <strong>tsconfig.json</strong>.
  In my folder structure I have <strong>tsconfig.json</strong>, <strong>webpack.config.js</strong> and <strong>package.json</strong> all next to each other in the root directory.</p>
  
  <p>Also when I console.log the result of <strong>Encore.getWebpackConfig()</strong> in my <strong>webpack.config.js</strong> I see that compilerOptions is an empty object. So the question is essentially; why doesn't the TypeScript compiler get my config?  </p>