Grunt生成新的node_modules

Question

I'm creating a grunt config to compile all my Typescript files to Javascript. I want to save all my generated Javascript files in a build folder but also keep the same folder structure.

Example: src/controllers/myController.ts will compile to: build/controllers/myController.js

I created a grunt config which does this exact thing but for some reasons it also generates a node_modules folder in the build directory and this takes a lot of time. My grunt config looks as followed:

    module.exports = function(grunt) {
      grunt.config.set('ts', {
        dev: {
          files: [
           {
            src: ['**/*.ts'],
            dest: 'build/'
            }
          ],
          options: {
            target: 'es5',
            fast: 'watch',
            comments: false,
            sourceMap: false,
            failOnTypeErrors: true,
            flatten: false,
            expand: true,
            module: 'system',
            moduleResolution: 'classic'
          }
        }
      });

      grunt.loadNpmTasks('grunt-ts');
    };

Is there any way to disable the node_modules generation process? Because I don't think i need them and it makes the compiling process incredibly slow.

Answer 1

The following configuration should meet your requirement. It will ignore the node_modules directory and reproduce the same source directory structure, (as found in src/ ), in the resultant build directory:

module.exports = function(grunt) {

  grunt.config.set('ts', {
    dev: {
      options: {
        rootDir: 'src/',
        target: 'es5',
        fast: 'watch',
        comments: false,
        sourceMap: false,
        failOnTypeErrors: true,
        module: 'system',
        moduleResolution: 'classic'
      },
      src: 'src/**/*.ts',
      dest: 'build/'
    }
  });

  grunt.loadNpmTasks('grunt-ts');
};

Notes:

• The rootDir property was added to the options object and it's value set to 'src/' .

• Both flatten: false and expand: true have been removed from the options object.

• The files property has been replaced with src and dest properties with their values set to src/**/*.ts and build/ respectively.

Example of resultant directory structure:

The following directory structure:

.
├── src
│   ├── another-folder
│   │   └── quux.ts
│   ├── controllers
│   │   └── myController.ts
│   └── foo.ts
├── Gruntfile.js
├── node_modules
│   └── ...
└── ...

Will result as follows after running $ grunt ts :

.
├── build
│   ├── another-folder
│   │   └── quux.js
│   ├── controllers
│   │   └── myController.js
│   └── foo.js
├── src
│   ├── another-folder
│   │   └── quux.ts
│   ├── controllers
│   │   └── myController.ts
│   └── foo.ts
├── Gruntfile.js
├── node_modules
│   └── ...
└── ...

Answer 2

Do you have a tsconfig.json setup in your project?

Probably you need to exclude the node_modules directory there (see documentation: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html ).

You can then use the tsconfig.json in your grunt config (see getting started section: https://github.com/TypeStrong/grunt-ts ).

module.exports = function(grunt) { 
  grunt.initConfig({
    ts: {
      default : {
        tsconfig: './tsconfig.json'
      }
  }}); 
  grunt.loadNpmTasks("grunt-ts");
  grunt.registerTask("default", ["ts"]);
};

With a corresponding tsconfig.json file like:

{
"include": [
    "src/**/*.ts*"
],
"exclude": [
    "node_modules"
],
"compilerOptions": {
    "target": "ES5",
    "fast": "watch,
    "sourceMap": false,
    "module": "system",
    "removeComments": true,
    "outDir": "build/",
    "rootDir" ".",
...
}

}

Note: Using a tsconfig.json is the best way to use TypeScript.

Hope this helps?