mac - Gulp no puede inyectar css y js al mismo tiempo
install gulp mac (1)
gulp-inject solo inyectará un conjunto de archivos, reemplazando el conjunto antiguo con el nuevo conjunto cada vez que lo llame. Hay dos formas de resolver el problema.
1) Desde la página github gulp-inject : use el plugin event-stream para combinar las dos secuencias de nombres de archivos (.css y .js) en una única secuencia que pase a inyectar.
var es = require(''event-stream''),
inject = require(''gulp-inject'');
// Concatenate vendor scripts
var vendorStream = gulp.src([''./src/vendors/*.js''])
.pipe(concat(''vendors.js''))
.pipe(gulp.dest(''./dist''));
// Concatenate AND minify app sources
var appStream = gulp.src([''./src/app/*.js''])
.pipe(concat(''app.js''))
.pipe(uglify())
.pipe(gulp.dest(''./dist''));
gulp.src(''./src/index.html'')
.pipe(inject(es.merge(vendorStream, appStream)))
.pipe(gulp.dest(''./dist''));
2) Una solución alternativa que puede adaptarse mejor a su organización de código actual es usar el parámetro de name gulp-inject para definir dos lugares diferentes para inyectar. Por lo tanto, tiene un archivo de encabezado como este:
<!DOCTYPE html>
<html>
<head>
<title>My index</title>
<!-- styles:css -->
<!-- the styles files will be injected here -->
<!-- endinject -->
</head>
<body>
<!-- scripts:js -->
<!-- the scripts files will be injected here -->
<!-- endinject -->
</body>
</html>
y luego tu gulpfile.js contiene algo como:
var inject = require(''gulp-inject'');
gulp.src(''./src/index.html'')
.pipe(inject(gulp.src(''./config.css''), {name: ''styles''}))
.pipe(inject(gulp.src(''./config.js''), {name: ''scripts''}))
.pipe(gulp.dest(''./dist''));
Estoy tratando de ejecutar el siguiente código
var $ = require(''gulp-load-plugins'')({ lazy: true }); // fetches gulp plugins
gulp.task(''wiredep'', function () {
var wiredep = require(''wiredep'').stream;
return gulp
.src(config.index)
.pipe(wiredep(config.wiredepDefaultOptions)) //wiredep injection configuration
.pipe($.inject(gulp.src(config.js))) //custom js files configuation
.pipe(gulp.dest(config.client))
});
/* inject bower and other injections */
gulp.task(''inject'', [''styles-compile'', ''wiredep''], function () {
return gulp
.src(config.index)
.pipe($.inject(gulp.src(config.css)))
.pipe(gulp.dest(config.client))
});
// si comento la siguiente línea .pipe($.inject(gulp.src(config.css)))
Entonces mis archivos .js se inyectan, de lo contrario no lo hacen, por lo que entiendo, esta inyección ocurre en paralelo.
¿Qué estoy haciendo mal?