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.