Some of the dependencies got Security Alerts but I am not going to clean the code. Feel free to fork !
...is an easy to use workflow which uses a docker container with gulpjs and some modules like babel, browserify and vinyl in a NodeJS environment.
Compile, transform, polyfill and pack your js/css/scss code as you like for your dist.
- just docker
If you have a running docker instance on your system the 'installation' breaks down in just these four steps:
- clone this repo:
git clone - (optional) configure
packe-json.jswith information about your project (you may read the docs) - build the docker-image with the script
build.sh - (optional) configure the gulpfile.js to edit/add/remove tasks (see below) and rebuild the image with
build.sh
- copy your file in the given folders
input/* - run the
start.sh - look at the
output/*folders (the results are also mentioned in your terminal)
The package-json and gulpfile.js (execept for AUTO_MODE) are not change at container runtime. You can edit your files as you like.
gulpfile.js is just a symbolic link to one of the files in the gulpfiles/ folder. By default the gulpfiles/000-default.js is used. You could edit this file or you can create your own. If you create one or if you would like to use multiple gulpfiles (e.g. for diffrent projects), create a .js file in the gulpfiles/ folder and update the symbolic link to your file:
ln -sf gulpfiles/my-own-gulpfile.js gulpfile.js
The task js-ac is taken from a great tutorial from Alessandro Castellani (THANKS !). It gives a good overview what's possible and useful. However the js-pitastic task is my preferred way. Your're welcome to create your own.
You can edit/add/remove tasks in this file or use your own as described above. You can also specify which tasks to run at the end of the script. Just pass the task names into the array
gulp.task('default', ["__HERE__"])You can also watch some files for changing and automatically run tasks on changes with adding a line
gulp.watch(__FILENAME__, [__TASKS TO RUN__])in this section.
At the beginning of the file the modules and filenames are defined. At every startup process a script sets your inputfile in a js-array. You could choose to use this autogenerated variable of inputfiles or your own array by setting up the AUTO_MODE variable in the settings section. Take care of that if you want to specify others files or just some files instead.
You needn't to use the filelist. Use the source folder (e.g. jsFolder) variable like this in your task:
gulp.src( jsFolder + "**/*.js" )Don't forget to look into the .babelrc file for babel-module options if you use it like Alessandro. You could also specify the options directly in the task like I do. The .babelrc file is ignored in this case.
If you want to use more modules you have to install them in the container during the build process. Therefore you have to add the install command (or just the package name) in the right section of theDockerfile. You have to choose by yourself under consideration if the module has to be installed globally first (-g flag) and if it's a production dependency (--save) or a dev-dependency (--save-dev).
After changing the Dockerfile you have to run the build.sh script again.
For debugging it is sometimes easier to jump into the container and try things out. If you would like to do that comment-out the last line in the Dockerfile
#ENTRYPOINT [_ENTRY-COMMANDS-GOES-HERE_]
Edit the start.sh and put a bash at the end of the last line. Rebuild the image with build.sh and run the start.sh. You will now get right into the container on startup.
Don't forget to change back this things and build the image again
If you want to fugure out what is causing an error or why your output is empty put the following line directly behind the function in question:
.on('error', console.error.bind(console))