I have started to learn Gulp.
It is nice, and now I have a dist folder, which is probably useless if I do not have a straight-forward method to put it on server.
Is there a way that Gulp will handle it for me, taking in concern to upload ONLY those files that modified or newly created? (In order to save upload time, sure).
I am working with Node.js.
Thanks.
how do you normally deploy to production? If you use ftp - there is a gulp function for that. If you use AWS S3 - there is a function for that. If you use something like docker or AWS EB, then you will continue to deploy through git etc - there is also likely to be a gulp function for this. Gulp is just a tool to process files and make build/deployment tasks easier.
Pulled straight from gulp website:
gulp is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.
Related
I used 2 tutorial clips from Microsoft (first, second) to build a sample Teams Message Extension.
I'm down to the final step of really starting the app with the gulp ngrok-serve command, but I get this error message:
...
[16:05:29] Watching .env
[16:05:29] The following tasks did not complete: ngrok-serve, serve, watch
[16:05:29] Did you forget to signal async completion?
I've read various suggestions on how to fix this, but the problem in my case is that I don't have the "ngrok-serve" task defined in my file. It seems to be running a "default" version of it.
So how should I define/overwrite it, so that I can fix it's implementation, in my gulpfile.js file ?
Thank you.
We were able to run the app successfully using gulp serve, as mentioned in the Build your first Microsoft Teams app using the Yeoman generator documentation. Please run the app using gulp serve.
Tech: gulp, polymer-build, bitbucket pipelines
I have a build step as part of a project which copies a bunch of bower_components files into the /dist folder. When run locally this works fine. However when running the same script on Bitbucket, it fails when reaching the module Chart.js
Error: ENOENT: no such file or directory, open '/opt/atlassian/pipelines/agent/build/bower_components/Chart.js/dist/Chart.min.js'
I believe the module cannot be found because of the capital 'C'. Since pipelines runs docker, is it possible to ensure that the filesystem is case-insensitive?
The build task is run with gulp and polymer-build, but I cannot find anything around case-insensitive copying or piping, and since the task runs fine on a mac. I believe it is an issue with the environment. Has anyone come across similar issues with the filesystem?
I want to know what is exact use of npm, grunt etc. in front-end development?
Why and how to use it?
NPM is a Node Package Manager - you can think of it as a way to automate a lot of installations for you by a single command using the CL (command line). Otherwise you would have to install all the scripts manually, which is generally rather messy, since they are often not as user-friendly as say... game or standard program installations.
Grunt/Gulp/Broccoli/etc. - While I am not using it myself, from what I heard and read: It is a tool, that can help you automate numerous tasks, you would have to normally do manually. Anything ranging from compiling any CSS/HTML/JS preprocessor, concatenating different files together into one big file, watching for changes in files to automatically upload them to a server and so on. Basically it is a highly configurable tool meant to help you automate mundane and boring tasks.
Actually, NPM is a package manager what allows you to download a lot of packages of software such as Gulp and Grunt, but also Bootstrap etc with the command line. You have to install node.js for this. You don't need this as a front-end developer but it will make installing the software much easier than install it manually which take mostly more time.
https://docs.npmjs.com/getting-started/what-is-npm for npm
https://www.npmjs.com/browse/star for popular modules
Software such as Grunt and Gulp will help front-end developers mostly with compiling SASS and LESS, CSS preprocessors which saves you time and allows you to have more functions in your css. Grunt, Gulp etc runs in the command line and makes it easier to edit your files. For example, I use myself Gulp in combination with SASS. Because SASS has to compile to css I have set up a command which automatically compiles my SASS files to a CSS file if I hit the save button in my code editor, the SASS:Watch plugin.
I highly recommend using SASS, and so using Gulp or Grunt.
http://sass-lang.com/documentation/file.SASS_REFERENCE.html SASS documentation
http://gulpjs.com/ Gulp documentation
http://gulpjs.com/plugins/ plug ins for gulp
Generator: https://github.com/Swiip/generator-gulp-angular
On my recent projects I just pushed everything with git even the minified versions. But the dist/ folder is on the gitignore.
I read you shouldn't store minified etc. versions anyways in your git, because you don't need version tracking there.
This gulp plugin uses git: http://yeoman.io/learning/deployment.html
1) So do I push it via git and then build it again on my server with gulp build?
2) What is a good way to automate it? I would like to do s.th. like this:
gulp serve:dist Serve it on my localhost
gulp serve:server Push it to my server delete old version and build the new version there
No. What you should do is work locally with all your project and when you have to deploy the minified file, only run gulp build. The dist directory will be created and the only thing you have to do is to initialize git in here with git init and then add your server as remote.
You only have to re-run the build and push the content of your dist when you want to update it.
I don't think a simple thing as this is worth to optimize.
For my current project I use Grunt as a full-deploy system. Checking/compiling all assets, cleaning cache, and deploying database. Now I am looking at Gulp.js. Everyone says, it has much more readable configuration file and it executes a bit faster. The only thing is missing for me - database deployment. With Grunt, I am using grunt-deployments package. Is there something like that for Gulp? Or should I write my own package?
Gulp is a build system. Build and Deploy are separate sets of activities. Steaming is good for building lots of smallish files like in an assembly line in manufacturing. For deployment, synchronous code (nodejs is not good at synchronous, atleast until v0.12) is good.
I use powershell(windows) or shell/chef/ansible(linux) for deployment/setup/etc, which call gulp for building assets pipeline.
Gulp is mostly targeted towards assets pipeline in other tech-stacks, and full build system for node-js techstack.
However, If you have only trivial deploy tasks, then consider using async.series() from async package and use regular node-js code to do the deployments. Accept and call the done callback when you are done in the gulp task.