I'm new to Node.js web development. Just created a project using ExpressGenerator (project structure generator for ExpressJS framework).
The question is: if I want to use FineUploader front-end JS library for my application, which is provided through NPM package, how should I embed it into my project properly? package.json manages server-side dependencies. When authors of front-end module publish it as npm, what approach to further usage they imply? Another package manager like Bower?
You are correct that package.json manages server-side dependencies but not entirely. You can - and should - rely on it to manage front-end dependencies as well.
For that to work you will need a module bundler, to package the node module for the browser. Some of the most popular bundlers for accomplishing this include Webpack, browserify, rollup among others.
Also note that you can delegate the bundling of node js modules to cdn services such as unpkg or wzrd so that all you need to do to use a node module in your front end code is include a link in your html to the cdn bundled module
Related
Hi I'm developing a project and for some reasons I am not able to use any webpack and node modules. I also cannot use any cdn. The vue project will only contain client side components. I don't have to consider the backend part, routing etc. The size of the project matters so I am not allowed to use node modules. How can I create a client-side only vue project without node modules and npm?
You can download Vue.js and use it locally in a project.
Development version (with debug mode and all warnings).
Production version (no warnings no debug)
After that you can just add it via a script tag:
<script src="your-vue-directory/vue.js"></script>
And you ready to go.
According to docs you can use CDN
<script src="https://cdn.jsdelivr.net/npm/vue#2.6.12"></script>
I am using angular2 with nodejs, how about using apache/xampp. will it support or nodejs npm server is mandatory for angular2
Considering for development ,NodeJS is Mandatory for angular2 !
let me tell you why?
Angular2 comes with typescript support which is transpiled into javascript.
NodeJS offers typings & other dependency packages like SystemJS,RxJS which helps angular2 do thye magic you call Angular.
Though you could run angular2 apps in Xampp but recommended approach will be with NodeJS as it offers a lot more flexibility & framework support for development.
for eg. Angular-Cli is node module which helps you setup your project really fast.
On top of that node gives you flexibilty to add third party libraries easily into your project.
You can use Xampp but then you will need your server to load transpiler manually which will transpile ts files into javascript files as currently there is no support in Xampp as far as I know and that will be quite a task to do.
So I will go with NodeJS on this.
For production:
once you build bundle from your application , it can be deployed to any server which runs javascript. So in that case NodeJS is not required.
It depends on what we are talking about.
For Development you must have NodeJS on your dev machine to load all libs, transpile TS, prepare build files and so on.
For Production server you can use whatever you want, if you have already prepared js bundles with all deps and your app, just static files with index.html, css, js, jpg files and so on..
I will also recommend you to go with Oleg Barinov.More over Angular2 applications only consist of static files so they can be serve by any static Web servers or server applications that can define static folders (Express, ...)
I've got a site that doesn't use RequireJS. I load all of my code in <script> nodes index.html.
I found a module on NPM, azure-storage, that I'd like to use. However the js files in the module contain code that assumes that I'm using RequireJS; The documentation says to use it via a require(), and the javascript files itself is littered with more require() calls.
I do not mind taking a dependency on RequireJS to consume this package. However all of the tutorials that I found gave me the impression that I need to restructure my entire application in a RequireJS style before I could require() the dependency that I found on npm.
Please tell me that I'm wrong. Is there a simple way for a non-RequireJS site to consume a RequireJS module?
In case it matters, my web app is built on AngularJS.
The problem here is browsers don't support require or any notion of modularity, really.
Assuming you just want to assign whatever azure-storage exports to a name in the global namespace (which assumes azure-storage and its dependencies will only consume APIs available on the browser), there are tutorials for using browserify or webpack to that end.
Either of those will build the azure-storage package and its dependencies into a solid .js file you can use in a <script> node that will assign whatever the module exports to a global name of your choosing.
I am using Express with Jade and I installed backbone.js and jQuery via npm. Do I copy the appropriate js files into my public/javascript folder or will Jade understand if I use require() inside the view template file?
Please steer me in the right direction.
Thanks
Anything installed with the package manager is available by require(). If you're trying to use the libraries to be rendered client-side, then you shouldn't be installing them server-side.
As hexacyanide says, Anything installed with the package manager is available by require().
If you want to use packages installed via npm in the browser, you may want to take a look at browserify. Although I'd recommend to at first simply using the files provided on the backbone and jQuery websites. It's less to learn.
NPM is only for server side JavaScript packages.
If you want to manage your client side libraries with a package manager take a look at bower, which shares some concepts of NPM, but for the client side.
I'm using node.js and backbone for a web app. Backbone is part of my package requirments. I've used Rails and Backbone before, and the helper gems are nice for piecing together all the assets (js files) that need to get to the client.
With that said, I had to manually download backbone.js and manually add it and all the other supported js libraries in the header of my app's layout file.
Should installing the backbone module get me away from that manual effort to create the required source for my client app? Is there some kind of jammit/asset pipeline?
you should simply npm install backbone in your main directory, this way all the submodules you use will find this exact backbone, and will use it
moreover, this way you can easily extend backbone with additional submodules
I use the stitch package to serve my scripts in node apps. With that, it's as simple as listing backbone.js as a dependency, and I install it with npm. That's convenient.