Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

awesome-typescript-loader load / compile only refrenced files

Is it possible to configure the awesome-typescript-loader or webpack or the tsc to just compile files that are referenced (directly, indirectly) from the entry? I want to port an existing application and want to be able to compile my partially ported code while some unreferenced files are not compilable.

Used tools

  • awesome-typescript-loader: 3.1.2,
  • webpack: 2.3.3

webpack.js

var webpack = require('webpack');
module.exports = {
    entry: {
        'index': './Scripts/index.ts',
    },

    output: {
        path: helpers.root('dist'),
        filename: '[name].js'
    },

    resolve: {
        extensions: ['.ts', '.js']
    },
    module: {
        rules: [
            {
                test: /.ts$/,
                loader: 'awesome-typescript-loader'
            }
        ]
    }
}

tsconfig

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "importHelpers": true,
    "typeRoots": [
      "node_modules/@types"
    ],
    "sourceMap": true,
    "lib": [
      "dom",
      "es5",
      "scripthost"
    ],
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true
  },
  "exclude": [
    "node_modules"
  ]
}

Error Messages (from files that are not referenced by index.ts)

[at-loader] Checking started in a separate process...

[at-loader] Checking finished with 46 errors
Hash: a2f6e7a56b152c02a325
Version: webpack 2.3.3
Time: 3554ms
   Asset     Size  Chunks             Chunk Names
index.js  2.73 kB       0  [emitted]  index
   [0] ./Scripts/index.ts 79 bytes {0} [built]

ERROR in [at-loader] ./Scripts/editor/foo.ts:47:61
    TS2448: Block-scoped variable 'eventList' used before its declaration.

... MORE ERRORS ...

npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build"
npm ERR! node v6.9.2
npm ERR! npm  v3.10.9
npm ERR! code ELIFECYCLE
npm ERR! [email protected] build: `webpack --config webpack.config.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] build script 'webpack --config webpack.config.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the FooBar package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     webpack --config webpack.config.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs FooBar
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls FooBar
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     D:\FooBar\npm-debug.log
like image 804
Sven-Michael Stübe Avatar asked Apr 05 '17 14:04

Sven-Michael Stübe


1 Answers

Webpack itself does not include any files that are not being imported. But TypeScript seems to check every file in your project unless otherwise configured. From the tsconfig.json docs:

If the "files" and "include" are both left unspecified, the compiler defaults to including all TypeScript (.ts, .d.ts and .tsx) files in the containing directory and subdirectories except those excluded using the "exclude" property.

You can set the files option to only include your entry point and it should only check the files you're importing.

"files": [
  "Scripts/index.ts"
]

As far as I've tested you can also set it to an empty array, so it won't check any files by default and awesome-typescript-loader will pass the files to the compiler as expected, and they will still be checked.

"files": []
like image 196
Michael Jungo Avatar answered Oct 16 '22 13:10

Michael Jungo