How to install in Angular 9 Web app?

Moralis General
#1

Hi, sorry for the noob questions but how do I install the library to use within my Angular 9 app?

I did ‘npm -i moralis’ so its installed within my projects node_modules folder.

Typically, we are using Typescript within Angular and have to add any new Module to the ‘app.module.ts’ file within Angular.

I see the docs state the Typescript typing’s are available. Should I be using the library as Typescript or import it as Javascript?

Do I import the library from my index.html file in a script tag that points to the Moralis folder in the node_modules folder?

#2

Hey @dve3413

I’m not ready to answer you regarding the correct way of using Angular with Moralis. I can suggest you to take a look at angular boilerplate made by one Moralis user https://github.com/kelber/demo-apps/tree/angular-moralis

This is not an official boilerplate, we are currently checking it

#3

Thank you Yomoo,

When I follow the boilerplate demo instructions. I am getting the following error when attempting to import the Moralis module. When I try to run ‘npm i --save-dev @types/moralis’ the types are not found. How do I install the types properly?

Could not find a declaration file for module ‘moralis/dist/moralis’. ‘c:/dve/movein/node_modules/moralis/dist/moralis.js’ implicitly has an ‘any’ type.
Try npm i --save-dev @types/moralis if it exists or add a new declaration (.d.ts) file containing declare module 'moralis/dist/moralis';ts(7016)

#4

You don’t need to install anything else. Typescript types are supported out-of-the box. The types are defined in /types . These are updated with every release.

#5

Thank you for the quick reply. How do I import the /types folder so my Angular project recognizes it? Shouldn’t it recognize it after ‘npm -i moralis’? It doesn’t though…

#6

I’m not sure how does it work with Angular. It should recognize it after npm -i moralis. Do you see any error messages?

#7

Below is the output from ‘npm install moralis’. I don’t see any errors but also don’t see any log messages about the typings? Is there a log message that can confirm the typings were installed?

npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances,
which is known to be problematic.
npm WARN deprecated [email protected]: This package is broken and no longer maintained. ‘mkdirp’ itself supports promises now, please switch to that.
npm WARN deprecated [email protected]: request has been deprecated,
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances,
which is known to be problematic.
npm WARN deprecated [email protected]: This module has been superseded by the multiformats module
npm WARN deprecated [email protected]: This module has been superseded by the multiformats module
npm WARN deprecated [email protected]: This module has been superseded by the multiformats module
npm WARN deprecated [email protected]: This module has been superseded by the multiformats module
npm WARN deprecated [email protected]: This module has been superseded by the multiformats module

[email protected] install C:\Program Files\nodejs\node_modules\moralis\node_modules\bufferutil
node-gyp-build

[email protected] install C:\Program Files\nodejs\node_modules\moralis\node_modules\secp256k1
node-gyp-build || exit 0

[email protected] install C:\Program Files\nodejs\node_modules\moralis\node_modules\utf-8-validate
node-gyp-build

[email protected] install C:\Program Files\nodejs\node_modules\moralis\node_modules\keccak
node-gyp-build || exit 0

[email protected] postinstall C:\Program Files\nodejs\node_modules\moralis\node_modules\core-js-pure
node -e “try{require(’./postinstall’)}catch(e){}”

Thank you for using core-js for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js:

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)

[email protected] postinstall C:\Program Files\nodejs\node_modules\moralis\node_modules\web3-shh
echo “WARNING: the web3-shh api will be deprecated in the next version”

“WARNING: the web3-shh api will be deprecated in the next version”

[email protected] postinstall C:\Program Files\nodejs\node_modules\moralis\node_modules\web3-bzz
echo “WARNING: the web3-bzz api will be deprecated in the next version”

“WARNING: the web3-bzz api will be deprecated in the next version”

[email protected] postinstall C:\Program Files\nodejs\node_modules\moralis\node_modules\web3
echo “WARNING: the web3-shh and web3-bzz api will be deprecated in the next version”

“WARNING: the web3-shh and web3-bzz api will be deprecated in the next version”

#8

I was able to get rid of the error by adding a file to the root of my Angular project, calling the file ‘global.d.ts’ with “declare module ‘moralis/dist/moralis’;” in it.

Now, it appears the Moralis module is working from within my Angular app but I don’t have the typings (code completion, etc). Just flying blind, declaring the module as ‘any’.

Would be great to get the typings working, not sure what I’m missing though.