Skip to content

Instantly share code, notes, and snippets.

@yagop
Last active December 28, 2017 20:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save yagop/a1332831b65e9cf7aa56ce349d6f7c6d to your computer and use it in GitHub Desktop.
Save yagop/a1332831b65e9cf7aa56ce349d6f7c6d to your computer and use it in GitHub Desktop.
Webpack example
{
"presets": ["env"]
}
node_modules
dist
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="my-first-webpack.bundle.js"></script>
</head>
<body>
</body>
</html>
{
"name": "example",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "webpack-dev-server --open --config webpack.config.js",
"prod": "NODE_ENV=production webpack --config webpack.config.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-preset-env": "^1.6.1",
"webpack": "^3.10.0"
},
"devDependencies": {
"webpack-dev-server": "^2.9.7"
}
}
alert("Hello");
const { resolve, join } = require('path');
const webpack = require('webpack')
const env = process.env.NODE_ENV || 'development'
const webpackConfig = {
entry: {
main: resolve(__dirname, 'src/main.js'),
},
output: {
path: resolve(__dirname, 'dist'),
filename: 'my-first-webpack.bundle.js'
},
module: {
rules: [
{
test: /\.(jsx|js)?$/,
use: [{
loader: 'babel-loader'
}],
},
],
},
plugins: [],
devServer: {
contentBase: join(__dirname, 'dist'),
compress: true,
port: 3000
}
};
if (env === 'production') {
webpackConfig.plugins.push(
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false,
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
unused: true,
dead_code: true,
warnings: false,
},
})
)
}
module.exports = webpackConfig;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment