Al principio, considere esto como una búsqueda de conocimiento de una persona (todavía) autodidacta. En el segundo día de aprendizaje de Webpack, estoy configurando la configuración de desarrollo de un nuevo proyecto con Gulp, Babel y Webpack 5. En la configuración, la parte de Gulp+Babel está bien y, por lo tanto, se omite. Busco su orientación en la configuración de Gulp+Webpack sobre si lo estoy haciendo correctamente o no, junto con dos consultas rápidas al final.

Mi webpack.config.js:

 const path = require("path"), webpack = require("webpack"); module.exports = { entry: { ... }, output: { ... }, plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", }), ], module: { ... }, };

Mi gulpfile.js

 const { dest, parallel, series, src, lastRun, watch } = require("gulp"), ... webpack = require("webpack-stream"), webpackConfig = require("./webpack.config.js"); ... function fWebpackBundling() { return src(["./readyBabel/babel.js"], { allowEmpty: true }) .pipe( webpack( webpackConfig ) ) .pipe(dest("dist/").on("finish", livereload.reload)); } ... function watchFiles() { watch("./_source/scripts/bl*.js", fCompileBabel); watch("./readyBabel/babel.js", fWebpackBundling); } function setupServer() { livereload.listen(function () { console.log(">> Server has been established. Let's Code..."); }); } exports.default = series( fCompileBabel, fWebpackBundling, parallel(setupServer, watchFiles) );

Y por último, mi app.js

 const $ = require("jquery"); $("h1.pt-div").css({ paddingTop: navheight => $("nav").outerHeight() });

Ahora aquí hay solo dos preguntas rápidas de sus expertos:

1. Aunque no produce errores en la consola, lo que implica que jQuery funciona bien, ¿podría confirmar si lo manejé correctamente?
2. mi mayor confusión , ¡funciona de todos modos sin mencionar PLUGIN ProvidePlugin en el archivo webpack.config.js también! Entonces, la confusión es: ¿qué diferencia hace esto? ¿Algún beneficio o algo?

Amablemente ayuda