问题
I am at my whits end here. I've been trying over the last 48 hours to get these technologies to work.I've read everywhere that they should be able to work but it's just one problem after the other. I've tried various combinations of my pubspeck.yaml file but the results I get are either the code simply wont build, or it just doesn't work >.>
I'll appreciate any help I can get!
my pubspeck.yaml:
name: blah
dependencies:
angular: 0.12.0
angular_node_bind: any
shadow_dom: any
browser: any
polymer: ">=0.11.0 <0.12.0"
core_elements: ">=0.0.6 <0.1.0"
paper_elements: any
transformers:
- angular
- polymer:
entry_points:
- web/index.html
dependency_overrides:
polymer: ">= 0.11.1-dev < 0.12.0"
browser: any
web_components: 0.4.0
analyzer: ">=0.15.6 <0.16.0"
html5lib: ">=0.11.0 <0.12.0"
My dart file:
import 'package:polymer/polymer.dart';
import 'package:angular/angular.dart';
import 'package:angular/application_factory.dart';
import 'package:angular_node_bind/angular_node_bind.dart';
// HACK until we fix code gen size. This doesn't really fix it,
// just makes it better.
@MirrorsUsed(override: '*')
import 'dart:mirrors';
void main() {
initPolymer().run(() {
applicationFactory().addModule(new AppModule()).addMdoule(new NodeBindModule()).run();
});
}
and finally my html:
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>GTHR</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<link href="css/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
<!-- <script src="packages/web_components/platform.js"></script>
not necessary anymore with Polymer >= 0.14.0 -->
<script src="packages/web_components/dart_support.js"></script>
<link rel="import" href="packages/paper_elements/paper_tabs.html">
<link rel="import" href="packages/paper_elements/paper_tab.html">
<link rel="import" href="packages/core_elements/core_header_panel.html">
<link rel="import" href="packages/core_elements/core_toolbar.html">
<script type="application/dart" src="Application.dart"></script>
<script src="packages/browser/dart.js"></script>
</head>
<body fullbleed layout vertical>
<!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<core-header-panel mode="waterfall">
<div class="core-header">
My App
</div>
<div>
<core-toolbar>
<paper-tabs selected="0" role="tablist">
<paper-tab>World</paper-tab>
<paper-tab>Followers</paper-tab>
<paper-tab>Mine</paper-tab>
</paper-tabs>
</core-toolbar>
</div>
</core-header-panel>
<div class="main-container">
<div class="main wrapper clearfix">
</div> <!-- #main -->
</div> <!-- #main-container -->
<div class="footer-container">
<footer class="wrapper">
<h3>footer</h3>
</footer>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.0.min.js"><\/script>')</script>
<!-- Latest compiled and minified JavaScript -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="packages/shadow_dom/shadow_dom.debug.js"></script>
<script src="js/flowtype.js"></script>
<script src="js/main.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='http://www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X');ga('send','pageview');
</script>
</body>
</html>
with my the following as is, Dart2js gives me the following output:
With the pubspeck.yaml I get the following output:
Loading source assets...
Loading smoke/src/default_transformer transformers...
Loading di transformers... (1.7s)
Loading observe transformers...
Loading angular transformers...
Loading polymer/src/build/mirrors_remover transformers...
Loading polymer transformers...
Loading polymer transformers...
Loading polymer transformers... (1.0s)
Building gthr-web... (14.1s)
[Info from Dart2JS]:
Compiling gthr-web|web/Application_static_expressions.dart...
[Error from Dart2JS]:
web/Application_static_expressions.dart:1:13:
Expected ';', but got '-'.
library gthr-web.web.Application.generated_expressions;
^
[Info from Dart2JS]:
Took 0:00:00.519007 to compile gthr-web|web/Application_static_expressions.dart.
[Info from Dart2JS]:
Compiling gthr-web|web/Application.dart...
[Error from Dart2JS on gthr-web|web/Application.dart]:
web/Application_static_expressions.dart:1:13:
Expected ';', but got '-'.
library gthr-web.web.Application.generated_expressions;
^
[Info from Dart2JS]:
Took 0:00:00.591015 to compile gthr-web|web/Application.dart.
[Info from Dart2JS]:
Compiling gthr-web|web/Application_static_injector.dart...
[Error from Dart2JS]:
web/Application_static_injector.dart:1:13:
Expected ';', but got '-'.
library gthr-web.web.Application.generated_static_injector;
^
[Info from Dart2JS]:
Took 0:00:00.501912 to compile gthr-web|web/Application_static_injector.dart.
[Info from Dart2JS]:
Compiling gthr-web|web/Application_static_metadata.dart...
[Error from Dart2JS]:
web/Application_static_metadata.dart:1:13:
Expected ';', but got '-'.
library gthr-web.web.Application.generated_metadata;
^
[Info from Dart2JS]:
Took 0:00:00.151240 to compile gthr-web|web/Application_static_metadata.dart.
[Info from Dart2JS]:
Compiling gthr-web|web/index.html_bootstrap.dart...
[Error from Dart2JS on gthr-web|web/index.html_bootstrap.dart]:
web/Application_static_expressions.dart:1:13:
Expected ';', but got '-'.
library gthr-web.web.Application.generated_expressions;
^
[Info from Dart2JS]:
Took 0:00:00.916099 to compile gthr-web|web/index.html_bootstrap.dart.
Build failed.
回答1:
I just started to look at your code (maybe I find more hints/suggestions/problems)
You should try to change
polymer: ">=0.11.1-dev <0.12.0"
to
polymer: ">=0.12.0-dev <0.12.0"
This pre-release version of the Polymer package contains some paper-elements related bug-fixes.
It seems you are using a -
(dash) in a library identifier where this character is invalid. You also shouldn't use a dash in Dart file names and all-lowercase characters.
EDIT
The package shadow_dom
is deprecated see http://pub.dartlang.org/packages/shadow_dom for more information
EDIT
applicationFactory().addModule(new AppModule()).addMdoule(new NodeBindModule()).run();
the second addModule
is misspelled (addMdoule
)
回答2:
Also keep in mind that you can override automatically resolved dependent packages versions in dependency_overrides
. This is what currently works for me:
dependencies:
angular: ">=0.12.0 <0.13.0"
polymer: ">=0.12.0-dev <0.13.0"
#core_elements: any
paper_elements: any
dependency_overrides:
analyzer: "0.15.6"
html5lib: "0.11.0"
web_components: "0.4.0"
dev_dependencies:
mock: any
unittest: any
transformers:
- angular
- polymer:
entry_points: web/main.html
source: angular-dart@groups.google.com : AngularDart and PaperElements
来源:https://stackoverflow.com/questions/24723315/material-design-with-angular-dart-and-polymer-dart-compilation-issues