Using nbind with Angular 5 and TypeScript

I am trying to use nbind to easily create a C ++ NodeJS module on an Angular website. I created a new Angular CLI project in Webstorm and went through the tutorial https://github.com/charto/nbind . Everything happens and the lib-types.dt file is created:

import { Buffer } from "nbind/dist/shim"; export class NBindBase { free?(): void } export class Greeter extends NBindBase { /** static void sayHello(std::string); */ static sayHello(p0: string): void; } 

I import the library into my AppComponent as follows:

 import { Component } from '@angular/core'; import * as nbind from 'nbind'; import * as LibTypes from './../lib-types'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { title = 'app'; sayHello() { const lib = nbind.init<typeof LibTypes>().lib; lib.Greeter.sayHello('aaaaaaaaaaaaaah'); } } 

I added a button with (click) => "sayHello ()", which should call the library. When I start the application, I get several warnings (a dependency request is an expression):

 WARNING in ./node_modules/nbind/dist/nbind.js 128:4-32 Critical dependency: the request of a dependency is an expression at CommonJsRequireContextDependency.getWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\dependencies\ContextDependency.js:39:18) at Compilation.reportDependencyErrorsAndWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:703:24) at Compilation.finish (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:561:9) at applyPluginsParallel.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compiler.js:502:17) at E:\Projects\streaming\asdf\streampp\node_modules\tapable\lib\Tapable.js:289:11 at _addModuleChain (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:507:11) at processModuleDependencies.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:477:14) at _combinedTickCallback (internal/process/next_tick.js:131:7) at process._tickCallback (internal/process/next_tick.js:180:9) @ ./node_modules/nbind/dist/nbind.js @ ./src/app/app.component.ts @ ./src/app/app.module.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts WARNING in ./node_modules/nbind/dist/nbind.js 141:14-42 Critical dependency: the request of a dependency is an expression at CommonJsRequireContextDependency.getWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\dependencies\ContextDependency.js:39:18) at Compilation.reportDependencyErrorsAndWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:703:24) at Compilation.finish (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:561:9) at applyPluginsParallel.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compiler.js:502:17) at E:\Projects\streaming\asdf\streampp\node_modules\tapable\lib\Tapable.js:289:11 at _addModuleChain (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:507:11) at processModuleDependencies.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:477:14) at _combinedTickCallback (internal/process/next_tick.js:131:7) at process._tickCallback (internal/process/next_tick.js:180:9) @ ./node_modules/nbind/dist/nbind.js @ ./src/app/app.component.ts @ ./src/app/app.module.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts WARNING in ./node_modules/nbind/dist/nbind.js 53:28-53 Critical dependency: the request of a dependency is an expression at RequireResolveContextDependency.getWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\dependencies\ContextDependency.js:39:18) at Compilation.reportDependencyErrorsAndWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:703:24) at Compilation.finish (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:561:9) at applyPluginsParallel.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compiler.js:502:17) at E:\Projects\streaming\asdf\streampp\node_modules\tapable\lib\Tapable.js:289:11 at _addModuleChain (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:507:11) at processModuleDependencies.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:477:14) at _combinedTickCallback (internal/process/next_tick.js:131:7) at process._tickCallback (internal/process/next_tick.js:180:9) @ ./node_modules/nbind/dist/nbind.js @ ./src/app/app.component.ts @ ./src/app/app.module.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts WARNING in ./node_modules/nbind/dist/nbind.js 72:28-57 Critical dependency: the request of a dependency is an expression at RequireResolveContextDependency.getWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\dependencies\ContextDependency.js:39:18) at Compilation.reportDependencyErrorsAndWarnings (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:703:24) at Compilation.finish (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:561:9) at applyPluginsParallel.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compiler.js:502:17) at E:\Projects\streaming\asdf\streampp\node_modules\tapable\lib\Tapable.js:289:11 at _addModuleChain (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:507:11) at processModuleDependencies.err (E:\Projects\streaming\asdf\streampp\node_modules\webpack\lib\Compilation.js:477:14) at _combinedTickCallback (internal/process/next_tick.js:131:7) at process._tickCallback (internal/process/next_tick.js:180:9) @ ./node_modules/nbind/dist/nbind.js @ ./src/app/app.component.ts @ ./src/app/app.module.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts 

Also, when I click the button, I get the following error:

 ERROR TypeError: Arguments to path.resolve must be strings at Object.exports.resolve (index.js:71) at findCompiledModule (nbind.js:70) at find (nbind.js:93) at Object.init (nbind.js:104) at AppComponent.sayHello (app.component.ts:14) at Object.eval [as handleEvent] (AppComponent.html:1) at handleEvent (core.js:13530) at callWithDebugContext (core.js:15039) at Object.debugHandleEvent [as handleEvent] (core.js:14626) at dispatchEvent (core.js:9945) 

Is this a bug in nbind, or am I importing my library incorrectly?

The current code can be found at https://github.com/kayvanbree/angular-nbind-boilerplate .

+7
angular
source share
2 answers

Angular is an interface platform. From your angular part, you can call the web service, but not directly use C ++ in your front end.

You need to configure one interior with nodeJS.

You can use the C ++ part in your NodeJS part with nbind. ( https://github.com/charto/nbind#using-nbind-headers )

After that, you can call the NodeJS server from angular.

You are trying to do this:

enter image description here

You want to do this:

+2
source share

The problem is that you are importing nbind into your angular application and nbind needs node or python to run nbind.

You should import the node application (server), not angular (client application).

+1
source share

All Articles