![]() ![]() PM2 has the -watch command so when I make changes, I don’t have to restart the project. I use PM2 to keep the NodeJS server running. If I change anything on my angular files, I want it to reload the app automatically. Since I already have a task runner, I decided to use it for more than just concatenating files. Above all, I feel like I can think while typing out what I want because it’s all coded! Gulp watch and Livereload with PM2 It’s my first time actually using a task runner! I guess it was just about time. I reloaded my MEAN app and it worked exactly how it worked before I ever used Gulp!īecause of this AngularJS problem, I was able to learn Gulp. I replaced all those tags with just one for ng-app.js. So I was able to fix my problem all inside that gulp task. I then specified where I want ng-app.js to go. ![]() So I called it ng-app.js and all angular files will be in there. Gulp-concat enables me to name the concatenated js file. Their order (from first to last) determines their order in concatenation, therefore, keeping dependencies in check. ![]() './public/lib/angular-resource/angular-resource.js',Īwesome! Inside the combine task I was able to specify the files I want to concatenate. './public/lib/angular-route/angular-route.js', Npm install gulp-concat -save-dev Create a gulpfile.js on the root of the project Npm install gulp -save-dev Install gulp-concat Npm install gulp -g I installed gulp in the project folder So how did I do it using Gulp? I installed Gulp globally Then, I wouldn’t have to learn another library. So I’m sure I’ll end up using a task runner eventually. Besides, I’m currently working on a MEAN project. Well for one, I’m working on a lot of JavaScript lately (whether on client-side or server-side). I wondered how a task runner could help me solve this problem. But before I dove deeper, I also stumbled upon Gulp. So before the project gets bigger, I thought maybe I could reduce the amount of script tags that maybe there’s a way to put all these files into one and still keep things in order of dependency. If we’re talking about a big MEAN app project, usually six modules aren’t enough. If this looks like a lot of script tags to you, imagine adding three more modules. At the very end, I have my main angular file application.js. Then angular-route and angular-resource comes after. I have to declare angular.js before any javascript file that depends on it. Each angular module has their own controllers, services, directives, configs, etc. Wow, just look at all those tags! I have three modules. Take a look at my original index.ejs file before I used Gulp: This might not always be the case for everyone but it’s possible. Later on, there’ll be too many tags to handle. Once you create more modules, you’ll need to add more tags. Having many AngularJS modules means having many tags. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |