Skip to content

Instantly share code, notes, and snippets.

@DaniAkash
Last active November 25, 2021 10:23
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save DaniAkash/811221175c9ef5c292f0fd6f1cec5bc3 to your computer and use it in GitHub Desktop.
Save DaniAkash/811221175c9ef5c292f0fd6f1cec5bc3 to your computer and use it in GitHub Desktop.
Webpack config with ES6, jquery, bootstrap and Hot Module Replacement support using webpack-dev-server. Dependencies needed by this configuration can be found in - https://gist.github.com/DaniAkash/6ec06b68033a5fe46fa68bfe3ce492fd
const webpack = require('webpack');
module.exports = {
context: __dirname,
entry: {
general: './src/js/general.js',
memes: './src/js/memes.js',
},
output: {
path: __dirname + "/dist",
filename: '[name].js',
publicPath: '/dist/',
},
devServer: {
compress: true,
port: 8080,
hot: true,
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env', 'es2015'],
}
}
},
{
test: /\.(svg|eot|ttf|woff|woff2)$/,
loader: 'url-loader',
options: {
limit: 10000,
name: 'fonts/[name].[ext]'
}
},
{
test: /\.(png|jpg|gif)$/,
loaders: [
{
loader: 'url-loader',
options: {
limit: 10000,
name: 'images/[name].[ext]'
}
},
'img-loader'
],
},
{
test: /\.(less|css)$/,
use: [
{
loader: "style-loader"
},
{
loader: "css-loader",
options: {
sourceMap: true
}
},
{
loader: "less-loader",
options: {
sourceMap: true
}
}
]
},
],
},
devtool: 'source-map',
plugins: [
new webpack.ProvidePlugin({
jQuery: 'jquery',
$: 'jquery',
jquery: 'jquery'
}),
new webpack.HotModuleReplacementPlugin(),
],
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment