web-dev-qa-db-fra.com

Exécuter un script npm à partir d'une tâche gulp

Comment exécuter une commande de script npm depuis une tâche gulp?

package.json

"scripts": 
{
    "tsc": "tsc -w"
}

gulpfile.js

gulp.task('compile:app', function(){
  return gulp.src('src/**/*.ts')
    .pipe(/*npm run tsc*/)
    .pipe(gulp.dest('./dist'))
    .pipe(connect.reload());
});

Je veux le faire parce que l'exécution de npm run tsc ne me donne aucune erreur mais si j'utilise gulp-TypeScript compiler .ts alors je reçois un tas d'erreurs.

13
lbrahim

Vous pouvez obtenir l'équivalent en utilisant gulp-TypeScript

var gulp = require('gulp');
var ts = require('gulp-TypeScript');

gulp.task('default', function () {
  var tsProject = ts.createProject('tsconfig.json');

  var result = tsProject.src().pipe(ts(tsProject));

  return result.js.pipe(gulp.dest('release'));
});

gulp.task('watch', ['default'], function() {
  gulp.watch('src/*.ts', ['default']);
});

Ensuite, sur votre package.json

"scripts": {
  "gulp": "gulp",
  "gulp-watch": "gulp watch"
}

Ensuite, exécutez

npm run gulp-watch

Vous pouvez également utiliser Shell

var gulp = require('gulp');
var Shell = require('gulp-Shell');

gulp.task('default', function () {
  return gulp.src('src/**/*.ts')
    .pipe(Shell('npm run tsc'))
    .pipe(gulp.dest('./dist'))
    .pipe(connect.reload());
});

gulp-Shell a été sur liste noire, vous pouvez voir pourquoi ici

Une autre alternative serait de configurer webpack.

11
BrunoLM

Vous pouvez essayer de l'implémenter à l'aide du package de nœuds childprecess ou

utilisez https://www.npmjs.com/package/gulp-run

var run = require('gulp-run');
gulp.task('compile:app', function(){
  return gulp.src(['src/**/*.js','src/**/*.map'])
    .pipe(run('npm run tsc'))
    .pipe(gulp.dest('./dist'))
    .pipe(connect.reload());

});
6
LazyDeveloper

Gaspillé environ 1 heure sur cette chose simple, à la recherche d'une ~ réponse complète, alors ajoutez-en une autre ici:

Si votre question concerne uniquement TypeScript (tsc), consultez https://stackoverflow.com/a/36633318/984471
Sinon, voir ci-dessous pour une réponse générique.

Le titre de la question est générique, donc un exemple générique est donné ci-dessous en premier, puis la réponse.

Exemple générique:

  1. Installez nodejs, si vous ne l'avez pas fait, de préférence la version LTS, à partir d'ici: https://nodejs.org/

  2. Installez ci-dessous:

    npm install --save-dev gulp
    npm install --save-dev gulp-run

  3. Fichier package.json a un contenu ci-dessous (d'autres contenus peuvent être là):

{ "name": "myproject", "scripts": { "cmd1": "echo \"yay! cmd1 command is run.\" && exit 1", } }

  1. Créez un fichier gulpfile.js avec le contenu ci-dessous:

"

var gulp = require('gulp');
var run = require('gulp-run');

gulp.task('mywatchtask1', function () {

  // watch for javascript file (*.js) changes, in current directory (./)
  gulp.watch('./*.js', function () {

    // run an npm command called `test`, when above js file changes
    return run('npm run cmd1').exec();

    // uncomment below, and comment above, if you have problems
    // return run('echo Hello World').exec();
  });
});

"

  1. Exécutez la tâche mywatchtask1 en utilisant gulp?

    gulp mywatchtask1

Maintenant, gulp surveille les modifications du fichier js dans le répertoire courant
si des changements se produisent, la commande npm cmd1 est exécuté, il imprimera yay! cmd1 command is run. chaque fois que l'un des fichiers js change.

Pour cette question: comme autre exemple:

une) package.json aura

"tsc": "tsc -w",

au lieu de ce qui suit:

"cmd1": "echo \"yay! cmd1 command is run.\" && exit 1",

bande, gulpfile.js aura:

return run('npm run tsc').exec();

au lieu de ci-dessous:

return run('npm run cmd1').exec();

J'espère que cela pourra aider.

1