Soy nuevo en webpack y he seguido la guía de inicio rápido para crear y procesar un archivo js simple de src a dist. Todo muy bien.
Sin embargo, ahora estoy tratando de hacer que procese más de un archivo JS, pero he encontrado un problema que no puedo encontrar. El archivo del tutorial original aún se procesa bien en dist, sin embargo, un nuevo archivo JS que he creado crea un archivo en dist, pero está vacío. El JS no se está minificando en el dist.
Entonces, al ejecutar lo siguiente. /dist/scripttwo.js está bien..
SIN EMBARGO, /dist/scriptone.js siempre es solo un archivo vacío.
webpack.config.js
const path = require('path'); module.exports = { entry: { scriptone: './src/scriptone.js', scripttwo: './src/scripttwo.js' }, output: { filename: '[name].js', path: path.resolve(__dirname, 'dist'), }, };scriptone.js
function sayhello() { return 'hello again'; }guióndos.js
import _ from 'lodash'; function component() { const element = document.createElement('div'); // Lodash, currently included via a script, is required for this line to work element.innerHTML = _.join(['Hello', 'webpack'], ' '); return element; } document.body.appendChild(component());Esto se debe a que no está exportando ni importando nada a scriptone.js .
para probar: exportar sayhello desde scriptone.js agregar lo siguiente al final del archivo:
export defalut sayhello y en scripttwo.js importe la función y utilícela dentro del archivo:
import _ from 'lodash'; import sayhello from './scriptone.js'; function component() { const element = document.createElement('div'); // Lodash, currently included via a script, is required for this line to work element.innerHTML = _.join(['Hello', 'webpack'], ' ') + sayhello(); return element; } document.body.appendChild(component());El código estará allí si usa mode: "development" .
De forma predeterminada, Webpack usa el modo de production , Webpack v4+ minimizará y agitará su código de forma predeterminada en el modo de producción. El código en scriptone.js no hace nada, no tiene efectos secundarios , es un código muerto, Webpack lo eliminará. Es por eso que obtiene un archivo de paquete dist/scriptone.js vacío.