Is there any maven like tool available for Ionic projects? - javascript

I'm having an Ionic project which I need to keep in github. When you start an Ionic project it auto generates a lot of library files. Do I need to keep all those library files while pushing the project to the github repo ? Is there something similar to maven available for Ionic projects which I can make use of ?

In JavaScript projects, we tend to use npm or bower. npm is the main one used these days (certainly has the largest ecosystem) and is also the one I mainly use, but bower certainly has quite a few front-end orientated modules that you can use.
npm comes packaged with NodeJS automatically; bower will require NodeJS to function as well, but is installed separately.

Related

How do I bundle JavaScript and CSS dependencies locally for offline use?

Potential similar question here.
I'd like to build a simple in-browser app that can run without an internet connection.
To develop a Python project, this isn't even a question. You just pip install whatever in your favorite virtual env and run offline all day. Your dependency list is also managed for you locally.
While building a toy project with npm, I can't figure out how to do the above. Parcel seems like a good tool to build, bundle, minify, etc. But in the end, all dependencies still point to a CDN. I understand this is default behavior, but there seems no way to easily pull all dependencies local and run offline.
Not a web dev so if I'm asking the wrong question, that sort of insight is appreciated also.
Edit: I've already built all the functionality I need. I can run successfully from file:// or a simple http server. What I'm trying to do in consolidate all the dependencies locally so as to not depend on a CDN at runtime. It'd be better to not go to each CDN/GitHub repo, manually download JS/CSS dependencies, and then manually link to them from my code. That's the point of using a bundler or similar. Is Electron or another framework really the best way to do this? For my use that feels like a lot of overhead.
You can use npm to install and maintain your dependencies. Lets say you are create your project from start. You will need to do the following steps. Assuming you have npm installed.
mkdir my-project //create project directory
cd my-project // cd into project direcotry
npm init // init npm project inside the directory.
After this you can install javascript packages using npm i package-name

Vanilla JavaScript NPM web project starter

I'm looking for NPM toolset to help me to create baseline for Web projects with vanilla JS. So, as we set up Angular projects with angular-cli ng init command, React projects with create-react-app, is there any recommended NPM global tooling to set up all common toolchain (mainly Webpack, Babel and some development server with hot reloading/change detection) for non framework based projects?
Thank you for any suggestinos
I'd look at yeoman and available generators to pick one that suits your needs the most.
Here's a couple that might fit you:
webapp generator
babel boilerplate
grunt provides scaffolding. There are templates available, or it's fairly easy to create your own.

how can I minimize&packaging Angular2 without Node.JS?

Reason:
I am doing one POC SPA with Angular2(using RC version).
Limited by company policy, we cannot install Node.JS, so Webpack is not available to me.
By now, there are 800+ HTTP requests(total 2.5 MB) at least once I load App home. Because we have developed many components among the App.
Question:
May you please advise me on How I can do minimize&packaging Angular2 code without Node.JS? (something like Third Party Library, Eclipse plugin and so on)
In other words, I want the Front-end one key deployment would be involved.
I think it would obviously increase performance.
Thank you in advance.
Disclaimer, I'm the author of Angular2 Eclipse.
I suggest you that you try Angular2 Eclipse which is based on TypeScript IDE.
When you install TypeScript IDE, you can install an embed node.js, so without installing at hand the node.js, you will benefit with TypeScript completion, validation, compilation, etc (which requires node.js to consume TypeScript tsserver).
You can even choose your version of TypeScript
Angular2 Eclipse provide the Angular CLI integration with terminal, wizards, launches, but in this case you need to install node.js (because it uses ng command that you must install it with npm install -g angular-cli
Please create an issue to give the capability to use ng command without installation:
ng should use the embed node.js (to avoid installing node.js)
provide an Eclipse Preference to link ng to a custom path (the custom path could be the angular-cli project that will download and host in your GIT, SVN repository).

What is node_modules directory in AngularJS?

I am exploring AngularJS tutorial project and found it has node_modules directory inside, which size if 60 megabytes.
Does simple clientside javascript project really need so huge corpus of unknown data?
I tried to delete this directory and project still works. I suspect it somehow relates with node.js and it's npm but how? Suppose I need to run my project on some conventional web server (not node.js), then how to know, which files/directories are unneeded?
Many javascript libraries require to use bower to install them. If I use bower, does this mean I need to keep node_modules?
The node_modules directory is only for build tools.
The package.json file in the app root defines what libraries will be installed into node_modules when you run npm install.
Very often with an angular app, on your dev machine or on a build server, you use other Javascript libraries from npm (a node.js package manager) to build your angular app. Tasks can be concatenating resources, using CSS preprocessors like LESS or SASS, minification, replacing of values, etc. etc. The most common tools for managing and running these tasks are called grunt and gulp, which are installed through npm as well.
When you deploy your app, you only distribute the resulting build, not any of the source files or build tools.
It is of course possible to write an AngularJS app without building anything.
edit from comments: When you dive into Angular more, there are more advanced techniques of using libraries installed by npm even in the client app, you then selectively choose the ones you need, not the whole 50MB+ thing. I'd recommend staying with the basic approaches until you get a good grasp on them though.
NPM is the node package manager, which installs packages locally into a project, specifically, into the node_modules folder. From there the package code can be included into a project, yes, can is the important word there.
The browser has no way to include modules in code (yet), so you need to use a library that can expose node's commonJS style modules. Browserify and Webpack are two popular methods of doing so.
Angular complicates this by introducing its own module system, which more closely resembles AMD-style modules. There are ways around this, so that you can use node-style modules, maybe your project uses those.
Using npm for managing dependencies is a great idea, its a fantastic package manager. It is likely in your case though that the project is only built using node and that the node_modules folder contains dependencies only related to the build.

Angular dependency missing from git

We'r developing an app in Steroids Supersonic framework (Based on Angular designed for Native apps). The team before us added following two dependencies which giving problems when we try to install all the dependencies using bower.
"angular-ui-laicos": "git#github.com:Laicos/angular-ui-laicos.git",
"appgyver": "git#github.com:Laicos/appgyver.git",
Both of git repositories are not there, so what kind of alternative would be used for this case? In the project at many places both dependencies are being used.

Categories