![](/img/trans.png)
[英]How to integrate Angular into my current Firebase node.js project?
[英]How to add my own node.js script to Angular 4 project
我有一個文件function.js,它導出函數以與一些api通訊並返回值。 它使用請求庫進行通信。 我在node.js應用程序中使用它。 如何在我的angular 4應用程序中導入/使用它?
我以為將此文件安裝為node_module。 因此,我創建了新的文件夾函數,即function.js,package-json和node_modules文件夾。 然后通過命令將其安裝在ng4應用中
npm install --save ./function
然后在types.d.ts中聲明
declare var Myfunction: any
並將其導入我的組件中
import * as Myfunction from "function"
但是當我嘗試使用它時,我得到一個錯誤:
ERROR in /Users/i343346/order-site/src/app/order/order.component.ts (37,12): Unexpected token. A constructor, method, accessor, or property was expected.
ERROR in /Users/i343346/order-site/src/app/order/order.component.ts (37,13): Function implementation is missing or not immediately following the declaration.
更新我嘗試了@Z。 Bagley answear,現在我可以導入文件了。 但出現錯誤:
WARNING in ./node_modules/ajv/lib/compile/index.js 13:21-34 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/i343346/order-site/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:677:24)
at Compilation.finish (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:535:9)
at applyPluginsParallel.err (/Users/i343346/order-site/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/i343346/order-site/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:481:11)
at processModuleDependencies.err (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:452:13)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickCallback (internal/process/next_tick.js:104:9)
WARNING in ./node_modules/ajv/lib/async.js 96:20-33 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/i343346/order-site/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:677:24)
at Compilation.finish (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:535:9)
at applyPluginsParallel.err (/Users/i343346/order-site/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/i343346/order-site/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:481:11)
at processModuleDependencies.err (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:452:13)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickCallback (internal/process/next_tick.js:104:9)
WARNING in ./node_modules/ajv/lib/async.js 119:15-28 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/i343346/order-site/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:677:24)
at Compilation.finish (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:535:9)
at applyPluginsParallel.err (/Users/i343346/order-site/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/i343346/order-site/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:481:11)
at processModuleDependencies.err (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:452:13)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickCallback (internal/process/next_tick.js:104:9)
我認為是與請求庫連接的,瀏覽器可能不支持。
在Angular 4項目中包含自定義javascript函數的一種簡單方法是將該項目包含在資產文件夾中,然后使用require
將其導入到組件打字稿中。
SRC /資產/ example.js
export function test() {
console.log('test');
}
SRC /應用程序/ app.component.ts
(在@Component(...)
之前)
declare var require: any;
const example = require('../assets/example');
(在export class AppComponent implements OnInit { ...
內部export class AppComponent implements OnInit { ...
)
ngOnInit() {
example.test();
}
我認為您可能還需要通過腳本標記將代碼包含在index.html中。
您可能會發現此其他答案很有用: https : //stackoverflow.com/posts/40635697/edit
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.