Grunt generates new 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.

score 1 · Accepted Answer · answered May 16 '18 at 13:06

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
│   └── ...
└── ...

This is exactly what I needed! Thank you! 1 thing I did notice is that Grunt only restructures the folder structure in the build directory when there are multiple Typescript file. And because I was only testing with 1 file it didn't create the maps in the build directory. Thanks for your help :) — Bob van 't Padje, May 16 '18 at 14:17

Daanist · Answer 2 · 2018-05-16T11:58:52.080

0

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?

edited May 16 '18 at 11:58

answered May 16 '18 at 09:59

Daanist

26
5

I tried this already but for some reason Grunt doesn't seem to respect my `tsconfig.json` file. If I use a `tsconfig.json` file and add it in my Grunt configuration it doesn't do anything. I used the following grunt config: `module.exports = function(grunt) { grunt.config.set('ts', { dev: { default : { tsconfig: './tsconfig.json' }, files: [ { src: ['**/*.ts'], dest: 'build/' } ], } }); grunt.loadNpmTasks('grunt-ts'); };` – Bob van 't Padje May 16 '18 at 10:06
Try adding `['**/*.ts' , "!node_modules/**"]` to the src. It should exclude the node_modules directory. I am not sure why your Grunt setup is not respecting your tsconfig.json. Did you try the minimalist setup I mentioned? Just using a tsconfig.json is a best practice as pointed out on the grunt-ts github page. – Daanist May 16 '18 at 10:16
I tried that, when I do this the node_modules wont get generated. But if I do this, the build folder structure gets all flattened out. So all my Javascript files are in the same folder. And I need the folder structure of the build directory to be the same as the src directory's – Bob van 't Padje May 16 '18 at 10:26
Not sure about your exact setup en config. What happens when you specify `src` as follows: `["src/**/*.ts"]`? Will it keep the folder structure in the outDir? And maybe you need to set `rootDir: "."` to your options? – Daanist May 16 '18 at 11:30

Grunt generates new node_modules

2 Answers2