Ik heb een eenvoudige webpack.config.js
module.exports = {
entry: "./app.js",
output: {
filename: "bundle.js"
},
}
En ik wil de waarden voor entry
en output
doorgeven via opdrachtregelargumenten. Kan dat en hoe moet ik dat doen?
Antwoord 1, autoriteit 100%
webpack.config.js
kan ook een functie van env exporteren die een conf-object kan retourneren. U kunt daarom een webpack-configuratie hebben zoals:
module.exports = env => {
return {
entry: env === "production" ? "./app.js": "app-dev.js",
output: {
filename: "bundle.js"
},
}
};
en roep dan webpack aan vanaf de opdrachtregel (of package.json) als volgt:
webpack --env=production
Antwoord 2, autoriteit 31%
U kunt aangepaste parameters opgeven voor de variabele env
vanaf de opdrachtregel, dus voor dit voorbeeld kunt u het volgende aanroepen:
webpack --env.entry='./app.js' --env.output='bundle.js'
en gebruik ze in uw webpack door te doen
module.exports = env => ({
entry: env.entry,
output: {
filename: env.output
},
});
Antwoord 3, autoriteit 28%
U kunt ook meerdere sleutel-waardeparen aan uw configuratie doorgeven met --env=key=value
:
webpack --env=mode=production --env=branch=develop
of (voor ontwikkeling met webpack-dev-server):
webpack serve --env=mode=production --env=branch=develop
webpack.config.js
ziet er als volgt uit:
module.exports = (env) => {
const mode = env.mode === 'prod' ? 'dev';
const branch = env.branch ? env.branch : 'develop';
return {
entry: mode === 'prod' ? './app.js': 'app-dev.js',
output: {
filename: 'bundle.js',
path: 'dist/' + branch),
},
}
}
Alle waarden die op deze manier worden doorgegeven, zijn beschikbaar als een object in de configuratie, waardoor ze gemakkelijk te gebruiken zijn.
{
WEBPACK_BUNDLE: true,
mode: 'production',
branch: 'feature-x',
foo: 'bar'
}
Antwoord 4, autoriteit 10%
U kunt het CLI-argument --env
gebruiken om willekeurige parameters aan de configuratie door te geven.
Bijvoorbeeld het volgende commando:
webpack --env entry=./entry.js --env output=./output.js
Zal het volgende env-object produceren:
{entry: './entry.js', output: './output.js'}
Die je dan als volgt in je configuratie kunt gebruiken:
module.exports = env => ({
entry: env.entry,
output: {
filename: env.output
},
});
Lees hier meer: Webpack – Omgevingsvariabelen
Antwoord 5, autoriteit 5%
U kunt het pakket argvgebruiken en de variabelen instellen. U moet dit doen vóór module.export
.
Antwoord 6, autoriteit 2%
De gemakkelijkste manier, naar mijn mening, om argumenten door te geven is door Node te gebruiken.
Omdat Webpack degene is die de argumenten ontvangt, kunt u uw opdrachtregelargumenten opslaan in een speciale omgevingsvariabele(die alleen binnen de sessie bestaat):
// webpack.config.js
process.env.MY_APPLICATION_NAME_ARGS = JSON.stringify(process.argv)
export default {
...
Vervolgens in uw main.js (overal waar u ze wilt ontleden), haalt u uw opdrachtregelargumenten op uit uw speciale omgevingsvariabele.
// main.js
const myArgs = JSON.parse(env.MY_APPLICATION_NAME_ARGS )
Omdat je alle argumenten ophaalt die je aan Webpack hebt doorgegeven, kun je hiermee alle node-modules (zoals bijvoorbeeld yargs) pijnloos gebruiken om ze te ontleden (of dit natuurlijk handmatig doen).
Dus je kunt dit soort dingen zonder problemen doen:
webpack ... --opt1 the_value --custom1 something
yarn run dev --opt1 the_value --custom1 something
enz.