topic Re: NPM Package? in ArcGIS JavaScript Maps SDK Questions

NPM Package?

JoshKing — Wed, 25 Nov 2015 03:33:54 GMT

Will the 4.0+ js library be available as a npm package?

Re: NPM Package?

BjornSvensson — Fri, 11 Dec 2015 23:55:12 GMT

I'm assuming you mean as a Bower package, like we've added for 3.x - https://developers.arcgis.com/javascript/jshelp/inside_bower_custom_builds.html.

Yes, the plan is to do this for the "4.0" production release (but probably not for the betas).

Re: NPM Package?

NathanLe_Ray — Wed, 16 Dec 2015 11:23:09 GMT

Hi!

I think he really means a NPM package as in Node Package Manager.

Bower is being deprecated in favor of NPM module.

It would really help to have a NPM module in order to use the API easily whih other loaders such as SystemJS (Angular 2).

Thanks.

Re: NPM Package?

JeffJacobson — Thu, 17 Dec 2015 17:49:28 GMT

Who says that Bower is being deprecated?

Edit: I am not seeing anything on the Bower website about support ending or anything like that, and the project seems to still be active on GitHub. What is the basis for saying that it is "deprecated"?

Re: NPM Package?

JoshKing — Thu, 17 Dec 2015 18:24:53 GMT

Agreed. Many shops are moving away from Bower. My current web projects just have a package.json utilized from Webpack. So as long as I can do a npm install, that would be great.

Re: NPM Package?

ReneRubalcava — Thu, 17 Dec 2015 19:42:24 GMT

The 4.0 API won't be available on NPM for a few reasons.

The Dojo dependencies which include dojox/dijit/dgrid/xstyle/put-selector and the build tools in util are not available via NPM, so dependency management via NPM wouldn't work very well.

NPM also doesn't lend itself well to downloading files to specific directories as shown in the samples.

When building with AMD, you'd ideally want each package in your src directory. You can setup dojoConfig to work around this, but again, you'd be pointing to bower_components for some deps and node_modules for others. This gets ugly quickly.

Bower is not being deprecated, they are just looking for more maintainers. That was more unfounded internet rumors that spread around.

Truth be told, by using Bower, we can make sure that users get the correct dependencies to do local builds. In our case, it really is the best choice at the moment.

You can see a demo using 3.x to do local builds here.

That's not to say that there won't be an NPM release in the future, just not with 4.0.

Re: NPM Package?

DanielBaternik1 — Wed, 24 Aug 2016 07:11:40 GMT

Do you mind sharing how you're using webpack with the arcgis js api? That would be a huge help to the increasing number of webpack devs.

Re: NPM Package?

MichaelMatuszak — Tue, 27 Sep 2016 16:27:32 GMT

FYI, most of the dependencies mentioned are now available in NPM:

dojox / dijit / dgrid / put-selector

And it's not a matter of whether or not Bower is supported, but that it's not the best choice for a lot of developers anymore, particularly when using ES6 modules or TypeScript. Considering we currently have to mitigate the Dojo AMD loader interfering with the module loader we actually want to use, having it be part of the reason for not having an NPM module is doubly frustrating.

Re: NPM Package?

EvelynHernandez — Tue, 27 Sep 2016 17:38:25 GMT

Maybe at this time they could reconsider adding a npm package with the 3.18 build or even best 4.0 and 3.8, cuz how @michael says, now a lot fo things are in npm and bower is not being used too much.

Anyways i worked on a repository with the help of @lobsteropteryx and @tomwayson to set up the api for some users that have problems with react + webpack config.

I hope can be useful.

Re: NPM Package?

ReneRubalcava — Tue, 27 Sep 2016 19:59:18 GMT

Build scenarios for these are currently being evaluated. There are still things that need to be tested. Even when using ES6 or TS, it still would need to be transpiled to AMD for use with the Dojo loader and loader plugins. There is already a system-js loader that will work with Angular 2 and other systemjs based frameworks.

Re: NPM Package?

JeffJacobson — Tue, 27 Sep 2016 20:41:06 GMT

The TypeScript compiler is capable of outputting AMD. See the module flag in the Compiler Options documentation.

Re: NPM Package?

ReneRubalcava — Sat, 11 Dec 2021 20:28:05 GMT

Correct, and you would still need to output babel or TS to AMD in order for custom builds to work.

The configuration to require to set up via NPM would like

window.dojoConfig = {
  packages: [
    {
      name: 'esri',
      location: 'node_modules/arcgis-js-api',
    },
    {
      name: 'dojo',
      location: 'node_modules/dojo',
    },
    // etc
  ]
};‍‍‍‍‍‍‍‍‍‍‍‍‍

That's because NPM doesn't allow you to change the install location such as Bower does.

Using ES6 or TS doesn't make using NPM over Bower any easier in most cases. The source and dependencies are still provided as AMD and most loaders/build tools are incompatible with Dojo loader plugins which are crucial for various dynamic loading tasks such as internationalization, dynamic loading of modules based on browser support and so on.

The exception to outputting to needing AMD output is when using SystemJS, because we're able to do some trickery in that regard with the loaders.

GitHub - Esri/esri-system-js: Load ArcGIS API for JavaScript modules using SystemJS

We also have tools for Ember GitHub - Esri/ember-cli-amd: Ember CLI Addon for using AMD libraries

In all cases, they still require using the Dojo loader in conjunction with other loaders and the Dojo build tools are still the recommended way to build JSAPI apps. Although the r.sj optimizer can come close.

There is a dojo webpack loader, but it still does not work 100% with all dependencies. GitHub - Nordth/dojo-webpack-loader: Webpack loader for Dojo Toolkit 1.x

We'll eventually have an NPM release of the API, I just can't say when that will happen.

Michael.Matuszak‌ if you have an app config and tooling you'd like me to test an NPM release on, please feel free to contact me. I'm always looking for various scenarios that users might be using that I have not thought of yet.

Re: NPM Package?

JeffJacobson — Tue, 27 Sep 2016 23:25:04 GMT

I see. Dojo 2 is supposed to be built with TypeScript. Maybe once the ArcGIS API is using Dojo 2 (which I assume will be quite a while after Dojo 2 is actually released due to the complexity of the migration) the NPM stuff will become easier to implement.

Re: NPM Package?

TomWayson — Tue, 06 Dec 2016 06:18:57 GMT

Just to add to what Rene Rubalcava‌ said above, I would say that whether or not Esri releases an npm distribution of the JSAPI is not actually that important.

It seems like many devs want an npm distribution is because they are using a module loader like webpack and a framework like angular2 or react where it is becoming more the norm to install libraries via npm than via bower. The thing is, an npm distribution isn't going to work any better in those situations than the current bower distribution, which is to say, it basically won't work with those tools until the issues with the dojo-webpack-loader are resolved, or until someone writes a similar plugin for Rollup.js or browserify, or whatever module loader you're using. Even then, I have my doubts about those bundlers ever being able to produce a smaller and/or faster build of the JSAPI than Dojo does.

However, there are a couple of patterns you can follow to use the JSAPI in applications built with a module loader like webpack. I describe how those patterns work and why you'd use one or the other in Using the ArcGIS API for JavaScript in Applications built with webpack | Tom Wayson. You do not need to download/install the JSAPI (via bower or npm) to use those patterns.

If you're using Dojo instead of webpack or other module bundlers, I don't see how getting the JSAPI via npm would be that helpful. In that case you probably want to base your app on either GitHub - odoe/generator-arcgis-js-app: Generator for ArcGIS JS API applications or GitHub - csnover/dojo-boilerplate: A starting point for developing with Dojo, which use bower and git submodules respectively.

So, in my experience, how you get the JSAPI modules (bower, CDN, etc) isn't as important as understanding that you have to use Dojo (not webpack, not browserify, etc) to load them. If you prefer to write your application following the conventions of your framework of choice, there are libraries like ember-cli-amd, esri-system-js, and esri-loader that can abstract working with the Dojo loader, but you may find yourself in trouble if you don't understand that under the hood they're still using Dojo.