Skip to content

Instantly share code, notes, and snippets.

@philcleveland
Created January 11, 2017 16:24
Show Gist options
  • Save philcleveland/caf4af0b534070ca0505b9be878e2a92 to your computer and use it in GitHub Desktop.
Save philcleveland/caf4af0b534070ca0505b9be878e2a92 to your computer and use it in GitHub Desktop.
WIP: Create a dev env for react using gulp and babel
# npm install -g create-react-app
create-react-app hello-world
cd hello-world
# set up Babel so we can use ES6
npm install --save-dev gulp-babel
npm install babel-preset-env --save-dev
touch .babelrc
echo "{
\"presets\": [\"env\"]
}" >> .babelrc
# set up gulp for builds
npm install --save-dev gulp
touch gulpfile.js
echo "var gulp = require(\"gulp\");
var sourcemaps = require(\"gulp-sourcemaps\");
var babel = require(\"gulp-babel\");
var concat = require(\"gulp-concat\");
gulp.task(\"default\", function () {
return gulp.src(\"src/**/*.js\")
.pipe(sourcemaps.init())
.pipe(babel())
.pipe(concat(\"all.js\")
.pipe(gulp.dest(\"dist\"))
.pipe(uglify({ preserveComments: 'license' }))
.pipe(rename({ extname: '.min.js' }))
.pipe(sourcemaps.write("."))
.pipe(gulp.dest(\"dist\"));
});" >> gulpfile.js
npm start
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment