Develop Reference

How to use github's kadena-io/cardano-crypto.js mnemonic in react native wallet

I want to use github's kadena-io/cardano-crypto.js.This is the cardano-crypto.js Link: https://github.com/kadena-io/cardano-crypto.js. But it is an error when used. I've tried a lot to fix the error, but it doesn't work. To get lib.js file in cardano-crypto.js, first I have to install npm. I did that. Then came the lib.js file. Then I tried to import cardano-crypto.js's mnemonicToRootKeyPair function to my react-native wallet. But there is an error. To solve the error, first I tried to import cardano-crypto.js with node module. Then I tried to import without node_module. I have imported in several ways.
import {} from 'path'
,
_importDefault (require ('path'))
. But somehow Cardano-crypto.js's mnemonicToRootKeyPair could not run/import. Error says lib.js: path could not be found. But the lib.js file is there. Now how do I solve this how to use mnemonicToRootKeyPair of cardano-crypto.js in our react native wallet?
This is the cardano-crypto.js mnemonicToRootKeyPair function code that I want to use:
async function mnemonicToRootKeypair(mnemonic, derivationScheme) {
validateDerivationScheme(derivationScheme)
if (derivationScheme === 1) {
return mnemonicToRootKeypairV1(mnemonic)
} else if (derivationScheme === 2) {
return mnemonicToRootKeypairV2(mnemonic, '')
} else {
throw Error(`Derivation scheme ${derivationScheme} not implemented`)
}
}
And this is the error when I use the function in my react native wallet:
Failed building JavaScript bundle.
Unable to resolve module path from C:\Users\DCL\Desktop\app\cardanoCrypto\lib.js: path could not be found within the project.

How to setup the DfxParser in Angular

I want to use https://github.com/gdsestimating/dxf-parser in my project. When i import in like:
import { DxfParser } from 'dxf-parser';
and than call:
new DxfParser()
i get an error:
TypeError: dxf_parser__WEBPACK_IMPORTED_MODULE_3__ is not a
constructor
What would be the correct way to use the DxfParser in angular? I want to do the same in angular as the jaascript example on projects site:
var parser = new DxfParser();
try {
var dxf = parser.parseSync(fileText);
}catch(err) {
return console.error(err.stack);
}
thanks a lot!

Like the readme of the github states, did you install DxfParser?
npm install dxf-parser
You might also need to install the types for typescript like so:
npm install #types/dxf-parser
Since installing does not seem to be the problem I tried it myself. Doing the import like you did does not work. I looked into the code and it seems that DxfParser is a default export. So if you do:
import DxfParser from "dxf-parser";
It should be working.
More information on exports can be found here

How do I manually include "#material/drawer" into my component?

I am trying to manually include the #material/drawer npm package into my Ember app. I tried following this guide but I'm running into some weird errors in my Chrome dev console:
Uncaught SyntaxError: Unexpected token *
Uncaught ReferenceError: define is not defined
The first is from the imported node_modules/#material/drawer/index.js file and the second is from my generated shim.
My component code:
import Component from '#ember/component';
import { MDCTemporaryDrawer, MDCTemporaryDrawerFoundation, util } from '#material/drawer';
export default Component.extend({
init() {
this._super(...arguments);
const drawer = new MDCTemporaryDrawer(document.querySelector('.mdc-drawer--temporary'));
document.querySelector('.menu').addEventListener('click', () => drawer.open = true);
}
});
In my ember-cli-build.js:
app.import('node_modules/#material/drawer/index.js');
app.import('vendor/shims/#material/drawer.js');
My generated shim:
(function() {
function vendorModule() {
'use strict';
return {
'default': self['#material/drawer'],
__esModule: true,
};
}
define('#material/drawer', [], vendorModule);
})();
What exactly am I doing wrong? It almost seems as though raw ES6 code got imported rather than compiled into my JS build output.
I also read this SO post but there are too many answers and I'm not sure which to do. It seems this specific answer is what I'm trying to do but not verbatim enough.

Creating a shim only ensures that ember-cli gets an AMD module, which you then can import in your app files.
If the npm package needs a build or transpiling step beforhand, this won't work.
You need a way to get the package build within the ember-cli build pipeline.
Luckily there are addons which can take care of this for you: ember-auto-import and ember-cli-cjs-transform.
You may have also heard of ember-browserify, which does the same thing, but it's deprectaed in favor of ember-auto-import.
I'd suggest you try ember-auto-import:
ember install ember-auto-import
You then should be able to import as you tried:
import { MDCTemporaryDrawer, MDCTemporaryDrawerFoundation, util } from '#material/drawer';
No shim or app.import needed, as ember-auto-import will take care of this for you.

angular 2 use a javascript package in typescript

I'm trying to use SignalR in an Ionic/Angular 2 application.
I'm building a simple Hub like so:
const accessToken = authManager.getRawAccessToken();
let hubUrl = environment.baseUrl + 'messages';
if (accessToken) {
hubUrl += '?authToken=' + accessToken;
}
this._hubConnection = new HubConnectionBuilder()
.withUrl(hubUrl)
.build();
I keep getting an error:
Cannot find name 'XMLHttpRequestResponseType'.
because SignalR requires a higher version of typescript than what's support currently by Ionic. https://github.com/aspnet/SignalR/issues/1375
I noticed SignalR is shipped by default using Javascript. Is there a way I can change my Import statement
import { HubConnection, HubConnectionBuilder } from '#aspnet/signalr';
So I can import javascript into a Typescript file as Any?
Edit
I've also tried:
import * as SignalR from '#aspnet/signalr';
but this still seems to use the typings file.

To use Js instead of Typescript?
Use raw require:
const { HubConnection, HubConnectionBuilder } = require('#aspnet/signalr');
The types for require are provided by npm i #types/node 🌹

Use third party library (parse.com) in Angular 2

I am learning Angular 2 and I followed the tutorials of Egghead already, but I am pretty new to everything concerning Angular.
Now I want to do something more advanced and start using Parse.com with Angular 2.
Normally I would include the parse.com library in the index.html page via <script src="//www.parsecdn.com/js/parse-1.6.2.min.js"></script>, but I want to write a ParseService via Angular 2 that I can use to manage the backend.
I can't seem to find how to include and use Parse in the service I want to write.
This is the very basic code I want to use to test the import.
import {Injectable} from 'angular2/core';
import {Parse} from '.../...'; // <-- This is what I want to do
#Injectable()
export class ParseService {
constructor() {
console.log('Creating ParseService');
Parse.initialize('', '');
}
}
I need some kind of Import at the top of the page including Parse, but from where should I get the necessary library? I already tried via npm but without success. Anyone already tried this?

uksz was right. You has to first install the component by the command
npm install --save parse
After that you can import it as any other component by typing
import {Parse} from 'parse';
For more info look at this link https://forum.ionicframework.com/t/how-to-require-xyz-in-ionic2-angular2/42042
Hope it helps;)
UPDATED
With new version of angular this approach stopped to work. Here is my new step by step: how to use Parse library in Angular2
Install Parse component to the project
npm install parse --save
Install Parse types
npm install #types/parse --save
import Parse module
const Parse: any = require('parse');
use Parse module
Parse.initialize("key");
...
Enjoy it with intellisense;)

You can do that by using OpaqueToken in Angular2
1. Create a Token that is used to find an instance as below in a separate ts file.
import { OpaqueToken } from '#angular/core'
export let name_of_The_Token = new OpaqueToken('name_Of_The_Window_Object');
2. In your App.module, you need to import and declare a variable that is the name of your window object which makes the Token as a angular2 service so that you can use properties, methods in that javascript file across your components.
import { name_of_The_Token } from '/* file_Path */';
declare let name_Of_The_Window_Object : any; //below your import statements
Step 3: Inject it to providers array of your module.
{ provide : name_of_The_Token , useValue : name_Of_The_Window_Object }
Guidance to use this token in components
Import the token just like any other service and #Inject from angular-core
import { name_of_The_Token } from '/* file_Path */';
import { Inject } from '#angular/core';
In constructor of the component
constructor(#Inject( name_of_The_Token ) private _serviceObject : any )
Any where in your component you can use the variables and methods of your javascript file as
this._serviceObject.method1()
this._serviceObject.variable1
.....
Note: One drawback is that you will not get intellisense.
Overcoming it:
If you are looking for intellisense you need to wrap the methods and variables inside an interface and use it in the type**(instead of any)** of your token as
export interface myCustom {
method1(args): return_Type;
method2(args): void;
.....
}

What you need to do, is you need to download Parse library with:
npm install parse
Then, you need to reference it in your import in the right way - you need to specify in which folder the parse.js file is placed at.