https://github.com/jaredlunde/webpack2-react-sass-es7-boilerplate
A boilerplate package for writing ES7 React components with SCSS, Webpack 2 and Babel
https://github.com/jaredlunde/webpack2-react-sass-es7-boilerplate
babel-es6 babel-webpack boilerplate boilerplate-template hmr hot-reload react react-boilerplate sass webpack2 webpack2-boilerplate
Last synced: 3 months ago
JSON representation
A boilerplate package for writing ES7 React components with SCSS, Webpack 2 and Babel
- Host: GitHub
- URL: https://github.com/jaredlunde/webpack2-react-sass-es7-boilerplate
- Owner: jaredLunde
- License: mit
- Created: 2016-08-16T22:44:26.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-04-23T18:13:32.000Z (about 8 years ago)
- Last Synced: 2024-05-02T00:02:51.456Z (about 1 year ago)
- Topics: babel-es6, babel-webpack, boilerplate, boilerplate-template, hmr, hot-reload, react, react-boilerplate, sass, webpack2, webpack2-boilerplate
- Language: JavaScript
- Size: 27.3 KB
- Stars: 6
- Watchers: 3
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# webpack2-react-sass-es7-boilerplate
A boilerplate package for writing ES7 React components with SCSS, Webpack 2 and Babel
Check out [webpack2-react-sass-env-boilerplate](https://github.com/jaredlunde/webpack2-react-sass-env-boilerplate)
for a more up-to-date example of working with Webpack 2.2, Babel 6, React and SASS which utilizes
`babel-preset-env` instead of `babel-preset-es2015 ...` or `babel-preset-latest`
## To use with a bash script:
1. Create `create-es-app` executable
```sh
echo '#!/bin/bash
if [ -z "$1" ]; then
echo "No package name was provided."
exit 1
fi
PKG_NAME=$1
mkdir $PKG_NAME
cd $PKG_NAME
npm init -y
npm install webpack2-react-sass-es7-boilerplate
cp -r ./node_modules/webpack2-react-sass-es7-boilerplate/. ./
mv package.json.tpl package.json
find . -type f \( -name "*.html" -o -name "*.ejs" -o -name "*.js" -o -name "*.json" \) -and -not -path "*/node_modules/*" -exec sed -i.bak -e "s/{{PKG_NAME}}/${PKG_NAME}/g" {} \;;
find . -type f -name "*.bak" -and -not -path "*/node_modules/*" -exec rm {} \;;
mv "./assets/css/{{PKG_NAME}}" "./assets/css/${PKG_NAME}"
npm start' > create-es-app
```
2. Make sure you can execute the script
```sh
chmod 0744 create-es-app
```
3. Execute the script w/ a package name
```sh
./create-es-app your-pkg-name
```