Skip to content

Instantly share code, notes, and snippets.

@mpobrien
Created August 13, 2016 00:20
Show Gist options
  • Save mpobrien/610d871c2c718b4b313af7e743212704 to your computer and use it in GitHub Desktop.
Save mpobrien/610d871c2c718b4b313af7e743212704 to your computer and use it in GitHub Desktop.
Webapp quick setup script
npm init -y
mkdir src
touch src/index.js
mkdir dist
npm install --save-dev react webpack webpack-dev-server react babel-core babel-loader babel-preset-es2015 babel-preset-react babel-preset-stage-2 react-dom
cat << EOF > dist/index.html
<!DOCTYPE html>
<html>
<body>
<div id="app"></div>
<script src="bundle.js"></script>
</body>
</html>
EOF
cat package.json | jq '.scripts.start="webpack-dev-server --progress --colors --config ./webpack.config.js"' | sponge package.json
cat << EOF > webpack.config.js
module.exports = {
entry: [
'./src/index.js'
],
module: {
loaders: [
{ test: /bootstrap\/js\//, loader: 'imports?jQuery=jquery' },
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel'
},
{
test:/\.less$/,
loader: "style!css!less"
},
{
test: /\.scss$/,
loaders: ['style', 'css', 'postcss', 'sass']
},
]
},
resolve: {
extensions: ['', '.js', '.jsx']
},
output: {
path: __dirname + '/dist',
publicPath: '/',
filename: 'bundle.js'
},
devServer: {
contentBase: './dist',
hot: true
},
devtool: "source-map"
};
EOF
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment