Pārlūkot kļūst arvien dzīvotspējīgāks risinājums skriptu izstrādei JS un piedāvāt sintaksi, kas veidota pēc sintakses Node.js. Kompilējiet skriptus ar Pārlūkot Ir vienkārši. Izstrādes laikā, izmantojot Skatīties ļauj apkopot failus lidojumā. Neskatoties uz to, ja vēlaties integrēt savu kompilāciju ar citiem uzdevumiem Malks (piemēram, failu kompilēšana Mazāk), jums rodas problēma: kā lietot skatīties tajā pašā laikā kā gulp-watch. Atbildi šajā rakstā!

kopsavilkums

Izmantojiet Gulp un Browserify — 0. līmenis

Name: Agence Web Tremplin Numérique
Price range: $$$

lietošana Malks et Pārlūkot ir pavisam vienkārši. Varat izmantot Browserify API vai vienkāršot un izmantot gulp-browserify, kas ļaus jums viegli apkopot failus.

const gulp= pieprasīt('gult');
const browserify= pieprasīt('gulp-browserify');
gulp.task("js", funkcija() {
gulp.src("src/*.js", { lasīt: nepatiess })
.pipe(browserify())
.pipe(gulp.dest('./būvēt/'))
});

Problēma, ar kuru jūs ātri saskaraties, ir tāda, ka, lai strādātu ar failiem un tie tiktu atkārtoti apkopoti, jums būs jāparsē visi faili. Tas ir ļoti dārgi. Pārlūkot būs jāielādē visi faili, bet arī visas izmantotās atkarības. Jo lielāks būs jūsu projekts, jo ātrāk paies laiks. Turklāt, ja lietojat pārveido kā Babelify reizes uzbriest vēl ātrāk (visu Babel pieejamo spraudņu saraksts). Arī visu sarakstu Pārlūkot transformācijas.

Pirms es parādīšu galīgo risinājumu, lūk, kā izskatītos risinājums ar klasisko gulp-watch.

gulp.task("skatīties", funkcija () {
gulp.watch(“./src/*.js”, [“js”]).mēs("mainīt", funkcija(notikums) {
mierināt.log(`Fails ${event.path} ir bijis ${event.type}`);
});
});

Izmantojot šo risinājumu, katru reizi, kad maināt kādu no failiem, tiek palaista visa kompilācija.

Skatīties

Skatīties ļauj efektīvi apkopot failus ar Pārlūkot. Tas saglabās atmiņā katra faila apkopošanas rezultātus (visus failus, kas saistīti ar jūsu failu, piemēram, atkarības...).

Kad fails tiek atjaunināts, tas atjaunina tikko modificēto faila pirkstu nospiedumu un ģenerē a saišķis neparsējot visas jūsu atkarības.

Izmantojiet Gulp, Browserify un Watchify – līmenis ∞

Node.js atkarību instalēšana

Jūs varat tos instalēt ar dziju (ja tiešām esat atjaunināts 🙂)!

1	$ dzija pievienot browserify gulp vinyl-buffer vinyl-source-stream watchify –dev

Pretējā gadījumā jūs izmantojat veco labo NPM 🙉

1	$ npm instalēt browserify gulp vinyl-buffer vinyl-source-stream watchify –save-dev

gulpfile.js

"stingra lietošana";
const browserify= pieprasīt("pārlūkot"),
buferis = pieprasīt("vinila buferis"),
gulp= pieprasīt("gult"),
ceļš = pieprasīt("ceļš"),
avots = pieprasīt(“vinila avota straume”),
lietotājs = pieprasīt(“gulp-util”),
skatīties = pieprasīt("skatīties"),
src = {
js: “./src/main.js”
},
galamērķis = {
js: "./būvēt/"
};
ļaut komplektētājs;
funkcija saišķi(profils) {
if (saišķis === undefined) {
if (profils === "skatīties") {
bundler = watchify(browserify(src.js));
} cits {
bundler = browserify(src.js);
}
}
saišķis();
}
funkcija saišķis() {
ļaut sākums = jauns datums().getTime(),
_ = komplektētājs
.saišķis()
.mēs("kļūda", util.log.bind(util, "Pārlūkprogrammas kļūda"))
.pipe(source(“main.js”))
.pipe(buffer())
.pipe(gulp.dest(dest.js)),
laiks = jauns datums().getTime() – sākums;
util.log("[browserify] rebundle take" , use.colors.cyan(`${time} ms`), util.colors.grey(`(${src.js})`));
atgriešanās _;
}
gulp.task(“js”, bundles.bind(nulle));
gulp.task("skatīties", funkcija () {
saišķi ("skatīties");
bundler.on("Atjaunināt", bundle.bind(nulle));
});
gulp.task("noklusējums", ["skatīties", “js”]);

Šeit jums ir ārkārtīgi vienkāršots, bet funkcionāls piemērs. Šo kodu varētu vēl vairāk vienkāršot, taču tajā ir parādīta koda skice, kas jāizveido, lai apstrādātu a karstā pārlādēšana efektīva.

Lai vienkāršotu jūsu uzdevumu, es jums piedāvāju arhīvu ar a guplfile.js pilnīgāka, kas apstrādā failu apkopošanu JavaScript ar Kņada (un daži presets piemēram, ES2015), bet arī failus Mazāk pārvaldot tādus profilus kā attīstība ar vai bez noskatīties bet arī ražošana ar samazināšanu!

Secinājumi

Tas ir pilnīgi iespējams izmantot Pārlūkot efektīvi ar Malks ar nosacījumu, ka spēlējat ar API. Tas liek jums nedaudz novirzīties no ceļa un iztikt bez spraudņiem Malks ko mēs parasti lietojam.