將Dart API導出爲JavaScript，沒有Dart VM

我想在沒有Dart VM的瀏覽器上將Dart API導出爲JavaScript。例如，假定A類：將Dart API導出爲JavaScript，沒有Dart VM

class A { 
    String name; 

    A(); 

    A.withName(this.name); 
}

我想使用導出的API能夠創建一個JavaScript對象：

var a = new A();

回答我previous question向我指出JS-互操作。

但是，在通過README example工作時，我無法獲得預期的結果。看來我的Dart庫沒有被導出到JavaScript中。

pubspec.yaml：

name: interop 
description: > 
    A library useful for applications or for sharing on pub.dartlang.org. 
version: 0.0.1 
dev_dependencies: 
    unittest: any 
dependencies: 
    js: 
    git: 
     url: git://github.com/dart-lang/js-interop.git 
transformers: 
    - js 
    - js/initializer

示例/ main.dart

庫主：

import 'package:js/js.dart'; 

main() { 
    initializeJavaScript(); 
}

LIB/a.dart

library a; 

import 'package:js/js.dart'; 

@Export() 
class A { 
    String name; 

    A(); 

    A.withName(this.name); 
}

的index.html

<html> 
    <head> 
    <script src="packages/js/interop.js"></script> 
    </head> 
    <body> 
    <script type="application/dart" src="build/example/main.dart"></script> 
    </body> 
</html>

（目前尚不清楚其中去年script標籤的src屬性應指向。我已經嘗試使用/example/main.dart，這並不會改變我的結果。）

我希望能夠在編譯（工具 - > Pub構建）和加載index.html後打開控制檯，然後這樣做：

var a = new dart.a.A();

但是，我得到這個，而不是：「不能讀取未定義的屬性'A'。換句話說，dart.a是未定義的。

在index.html中包含原始Dart腳本表明js-interop是針對具有Dart VM的瀏覽器的。我嘗試在Dartium上運行index.html，結果相同。

我錯過了什麼？

來源

2014-12-05 Rich Apodaca

腳本標記的src屬性仍然必須指向帶有包含main()方法的Dart腳本的文件。當應用程序使用JavaScript編譯爲pub build Dart被編譯爲JavaScript，並且可以在沒有Dart VM的瀏覽器中運行。

來源

2014-12-05 21:39:00

謝謝，這很好。鑑於此，關於我的設置出錯的地方有什麼想法？ – 2014-12-05 21:55:13

我還沒有使用這個包，但我知道你需要運行'pub build'來從Dart和'main.dart'文件獲取JavaScript，'src'文件指向的不能在'build'目錄中。當你運行'pub build'時，'build'目錄被清除。 'main.dart'文件應該在'web'目錄下，'src'屬性應該是'src =「main.dart' – 2014-12-05 22:00:35

感謝您的提示。我添加了一個'web'目錄並將index.html編輯src指向「main.dart」，我可以「運行」index.html，然後服務器啓動，但問題仍然存在，加載頁面後dart.a未定義，頁面上沒有錯誤，當我加載頁面時，許多dart文件會被加載，如Dart編輯器中的「工具輸出」所證明的那樣。 – 2014-12-05 22:23:52

是的，它只能在JavaScript瀏覽器上工作。事實證明，文檔並沒有給出所有的步驟。從一個新項目開始，這就是我的工作。

使用（File-> New Project/package）創建一個名爲'jsout'的新包項目。刪除這些文件：

test/all_test.dart
example/jsout.dart

編輯這些文件：

pubspec.yaml

name: jsout 
description: > 
    A library useful for applications or for sharing on pub.dartlang.org. 
version: 0.0.1 
dev_dependencies: 
    unittest: any 
dependencies: 
    js: 
    git: 
     url: git://github.com/dart-lang/js-interop.git 
transformers: 
    - js 
    - js/initializer

的lib/main.dart

part of main; 

@Export() 
class A { 
    String name; 

    A(); 

    A.withName(this.name); 

    talk() { 
    print(name); 
    } 
}

創建文件夾web，並添加這些文件：

網/ main.dart

library main; 

import 'package:js/js.dart'; 

part '../lib/jsout.dart'; 

main() { 
    initializeJavaScript(); 
}

網/ index.html的

<!DOCTYPE html> 
<html> 
    <head></head> 
    <body> 
    <script src="main.dart_initialize.js"></script> 
    <script src="main.dart.js"></script> 
    </body> 
</html>

更新這些文件，加載後的index.html，並打開控制檯：

var a = new dart.main.A.withName('foo'); 

a.talk(); // returns 'foo'

此過程做過修訂7afdb的。

來源

2014-12-06 00:42:31

爲什麼你有'main.dart.js'作爲腳本源，你甚至沒有這樣的文件，我想你應該在這裏引用'main.dart'文件''pub build'或'pub服務器'應該從一個不支持Dart的瀏覽器加載時替換它。 – 2014-12-06 09:30:08

這種方法在運行Dartium時工作，但沒有t Chrome。在後一種情況下，運行構造函數時會引發錯誤。使用JavaScript文件時，該錯誤消失。 – 2014-12-06 15:29:36

當你從'pub build'生成的'build/web'加載'index.html'？你能發佈錯誤信息嗎？你有沒有嘗試過「酒吧服務」（或從DartEditor的窗簾後面使用「酒吧服務」發起）。 – 2014-12-06 15:33:18

將Dart API導出爲JavaScript，沒有Dart VM

回答

相關問題