Last Updated: November 21, 2025
Basic Config
// webpack.config.js
module.exports = {
entry: './src/index.js',
output: {
path: __dirname + '/dist',
filename: 'bundle.js'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.css$/,
use: ['style-loader', 'css-loader']
}
]
}
};
Common Loaders
| Item | Description |
|---|---|
babel-loader
|
Transpile JavaScript |
css-loader
|
Load CSS files |
style-loader
|
Inject CSS into DOM |
file-loader
|
Load files as URLs |
sass-loader
|
Load SCSS/Sass |
💡 Pro Tip:
Use webpack-dev-server for hot module replacement!