joost-de-vries / play-angular-typescript.g8 Goto Github PK
View Code? Open in Web Editor NEWA giter8 template for a Play Angular 4 Typescript application
License: Other
A giter8 template for a Play Angular 4 Typescript application
License: Other
I need a working copy of this seed example for a new application. When I clone and run get the error below. What is the issue and how can be solved? Oh I checked and the same error happens in travis I see that the build is broken there with this same issue ... I don't feel too bad now :) but would be nice if it is fixed or someone help me figure out how to fix it.
Creation of the application template fails with an unresolved dependency
[2K�[0m[�[0minfo�[0m] �[0mResolving org.webjars.npm#jsesc;[0.5.0,0.6) ...�[0m
�[0m[�[33mwarn�[0m] �[0m ::::::::::::::::::::::::::::::::::::::::::::::�[0m
�[0m[�[33mwarn�[0m] �[0m :: UNRESOLVED DEPENDENCIES ::�[0m
�[0m[�[33mwarn�[0m] �[0m ::::::::::::::::::::::::::::::::::::::::::::::�[0m
�[0m[�[33mwarn�[0m] �[0m :: org.webjars.npm#through;0: not found�[0m
�[0m[�[33mwarn�[0m] �[0m ::::::::::::::::::::::::::::::::::::::::::::::�[0m
�[0m[�[33mwarn�[0m] �[0m�[0m
�
Hello Joost,
sorry for my question asked here. I saw in your html file there are references to the lib directory, e.g. "<script type='text/javascript' src='@routes.Assets.versioned("lib/systemjs/dist/system-polyfills.js")'></script>
". But there is actually no such directory in your project. Therefore I got errors like "GET
http://127.0.0.1:9000/assets/lib/angular2/bundles/angular2-polyfills.js 404 not found" in the Firefox console. Could you tell me how to create this directory and get the library files?
Thank you very much!
Best Regards
Wei
Hi, I'm trying to run the sbt application, but I'm getting the following error
coursier.ResolutionException: Conflict(s) in dependency resolution:
org.webjars.npm:glob:5.0.15:default(compile)
org.webjars.npm:glob:7.0.6:default(compile)
[error] (*:coursierResolution) coursier.ResolutionException: Conflict(s) in dependency resolution:
[error] org.webjars.npm:glob:5.0.15:default(compile)
[error] org.webjars.npm:glob:7.0.6:default(compile)
I have tried with both activator run and sbt run. Tried creating an app using activator new
and also by cloning the repository. The same error comes up in all cases.
I am not able to pass properties into the component. Here are the changes to reproduce the issue:
modify app/views/index1.scala.html:
<todo-app myprop="someValue"></todo-app>
modify app/assets/app/app.ts to import Input and add the property:
import {Component, Input} from "@angular/core"
.....
export default class TodoAppComponent implements OnInit {
@Input() myprop:string
.....
At runtime the myprop property will be undefined. I noticed that the issue is only with the top level component from the scala.html file. I was able to pass properties to components under the app/assets/app.
Although it doesn't appear to cause issues in your TodoMVC example application, calling System.import in the head tag can cause the application to bootstrap itself before the dom is ready.
This has happened to me, and and others.
The solution is to move the script to the bottom of the body tag. Strangely, Angular's own documentation, shows the bootstrapping call in the head. I'm not sure if it's because Angular is still RC and the docs are being hastily written, or that they know something I don't 😕
I am trying to use this seed by running:
sbt new joost-de-vries/play-angular-typescript.g8
And then (from the project folder):
sbt run
But I get a javascript exception when loading the page:
Error: Invalid regular expression: missing /
Evaluating http://localhost:9000/assets/systemjs-angular-loader.js
Loading http://localhost:9000/assets/systemjs-angular-loader.js
Instantiating http://localhost:9000/assets/app/main.js
Loading assets/app/main.js
The links in the Readme.md are broken.
I'm using the index1 configuration for development (SystemJS downloads individual JavaScript files) but I can't seem to get loading of 3rd party libs to work.
I can import modules which are part of the angular2.js bundle since they are already loaded from the <script>
tag and I can import my own modules but for everything else SystemJS tries the wrong URL.
E.g. import { Http } from 'angular2/http'
causes SystemJS to try localhost/angular2/http
.
It seems like the System.config in index1.html needs to be changed but I'm not sure how to fix it. There is no way to make a map entry that applies to all libs by default. I would need to change the imports in my typescript code to start with "lib/" but then the directory structure produced by sbt-typescript is wrong and sbt fails.
Any ideas? Or am I missing something?
I run web application with command line sbt run
. After open application with port 9000 is http://localhost:9000/
an present an error message as below. What's a points problems on Tllint configuration file name tslint.json
?
com.typesafe.sbt.jse.SbtJsTask$JsTaskFailure:
E:\workspacescala\play-angular2-typescript\project\target\node-modules\webjars\tslint\lib\error.js:29
var shownWarnings = new Set();
^
ReferenceError: Set is not defined
at Object.<anonymous> (E:\workspacescala\play-angular2-typescript\project\target\node-modules\webjars\tslint\lib\error.js:29:25)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (E:\workspacescala\play-angular2-typescript\project\target\node-modules\webjars\tslint\lib\configuration.js:23:15)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at com.typesafe.sbt.jse.SbtJsTask$$anonfun$com$typesafe$sbt$jse$SbtJsTask$$executeJsOnEngine$1.apply(SbtJsTask.scala:215)
at com.typesafe.sbt.jse.SbtJsTask$$anonfun$com$typesafe$sbt$jse$SbtJsTask$$executeJsOnEngine$1.apply(SbtJsTask.scala:187)
at scala.util.Success$$anonfun$map$1.apply(Try.scala:206)
at scala.util.Try$.apply(Try.scala:161)
at scala.util.Success.map(Try.scala:206)
at scala.concurrent.Future$$anonfun$map$1.apply(Future.scala:235)
at scala.concurrent.Future$$anonfun$map$1.apply(Future.scala:235)
at scala.concurrent.impl.CallbackRunnable.run(Promise.scala:32)
at scala.concurrent.impl.ExecutionContextImpl$$anon$3.exec(ExecutionContextImpl.scala:107)
at scala.concurrent.forkjoin.ForkJoinTask.doExec(ForkJoinTask.java:260)
at scala.concurrent.forkjoin.ForkJoinPool$WorkQueue.runTask(ForkJoinPool.java:1339)
at scala.concurrent.forkjoin.ForkJoinPool.runWorker(ForkJoinPool.java:1979)
at scala.concurrent.forkjoin.ForkJoinWorkerThread.run(ForkJoinWorkerThread.java:107)
[error] (web-assets:tslint) com.typesafe.sbt.jse.SbtJsTask$JsTaskFailure:
Out of curiosity, what is recommended in terms of IDE for this seed? I am used to Visual Studio Code when it comes to Angular applications, but it seems it does not work out of the box since dependencies are managed with sbt.
Hi,
Can you please update the readme to validate if the gotcha's are still valid? Is it possible to update the Angular version to recent version now
Thanks
I am trying to use this template but got a dependency issue stating:
org.webjars.npm typescript 2.3.2 not found
It is indeed not present here: https://mvnrepository.com/artifact/org.webjars.npm/typescript.
I was wondering if you can add support for scss too, It will be better and cleaner, I know this could be tricky but just to keep this item as enhancement for later.
Hi!
I was trying to execute the third option, where a single JavaScript is generated and provided by the server. I have no problem with the second option, multiple files compiled by the server and provided separately.
The problem I got was that app/bootstrap
is not found on the main page.
I changed the Application
controller to return index2.scala.html
and passed the jvm parameter -DtsCompileMode=stage
when running:
activator ~run -DtsCompileMode=stage
The browser tells me that it finds the main.js
, the problem is when loading app/bootstrap
here; it tries to download a localhost/app/bootstrap
instead of loading it from main.js
(I checked and it is not inside main.js
).
I don't know if I am doing something wrong, if something is missing or if this is a bug.
Thank you! 😄
Hello all,
I cannot run command sbt test
because project show error as below
PS C:\workspacescala\webapp-example\> sbt test
Java HotSpot(TM) 64-Bit Server VM warning: ignoring option MaxPermSize=512m; support was removed in 8.0
[warn] Executing in batch mode.
[warn] For better performance, hit [ENTER] to switch to interactive mode, or
[warn] consider launching sbt without any commands, or explicitly passing 'shell'
[info] Loading project definition from C:\workspacescala\webapp-example\project
[info] Set current project to tracethreatweb-fwdist (in build file:/C:/workspacescala/webapp-example/)
[info] Typescript linting on 3 source(s)
[error] C:\workspacescala\webapp-example\target\tslint\tslint.js:64
[error] var tsProgram = Linter.createProgram(sbtTslintConfig.tsConfigFile);
[error] ^
[error]
[error] TypeError: Linter.createProgram is not a function
[error] at C:\workspacescala\webapp-example\target\tslint\tslint.js:64:28
[error] at Object.<anonymous> (C:\workspacescala\webapp-example\target\tslint\tslint.js:117:2)
[error] at Module._compile (module.js:570:32)
[error] at Object.Module._extensions..js (module.js:579:10)
[error] at Module.load (module.js:487:32)
[error] at tryModuleLoad (module.js:446:12)
[error] at Function.Module._load (module.js:438:3)
[error] at Module.runMain (module.js:604:10)
[error] at run (bootstrap_node.js:389:7)
[error] at startup (bootstrap_node.js:149:9)
[info]
com.typesafe.sbt.jse.SbtJsTask$JsTaskFailure: C:\workspacescala\webapp-example\target\tslint\tslint.js:64
var tsProgram = Linter.createProgram(sbtTslintConfig.tsConfigFile);
^
TypeError: Linter.createProgram is not a function
at C:\workspacescala\webapp-example\target\tslint\tslint.js:64:28
at Object.<anonymous> (C:\workspacescala\webapp-example\target\tslint\tslint.js:117:2)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.runMain (module.js:604:10)
at run (bootstrap_node.js:389:7)
at startup (bootstrap_node.js:149:9)
at com.typesafe.sbt.jse.SbtJsTask$$anonfun$com$typesafe$sbt$jse$SbtJsTask$$executeJsOnEngine$1.apply(SbtJsTask.scala:215)
at com.typesafe.sbt.jse.SbtJsTask$$anonfun$com$typesafe$sbt$jse$SbtJsTask$$executeJsOnEngine$1.apply(SbtJsTask.scala:187)
at scala.util.Success$$anonfun$map$1.apply(Try.scala:206)
at scala.util.Try$.apply(Try.scala:161)
at scala.util.Success.map(Try.scala:206)
at scala.concurrent.Future$$anonfun$map$1.apply(Future.scala:235)
at scala.concurrent.Future$$anonfun$map$1.apply(Future.scala:235)
at scala.concurrent.impl.CallbackRunnable.run(Promise.scala:32)
at scala.concurrent.impl.ExecutionContextImpl$$anon$3.exec(ExecutionContextImpl.scala:107)
at scala.concurrent.forkjoin.ForkJoinTask.doExec(ForkJoinTask.java:260)
at scala.concurrent.forkjoin.ForkJoinPool$WorkQueue.runTask(ForkJoinPool.java:1339)
at scala.concurrent.forkjoin.ForkJoinPool.runWorker(ForkJoinPool.java:1979)
at scala.concurrent.forkjoin.ForkJoinWorkerThread.run(ForkJoinWorkerThread.java:107)
There are now Angular 2 RC.3 deps at http://www.webjars.org/npm. Would it be possible to update this template accordingly?
Hi, great activator!
However when doing sbt dist for production and then launching the binary file it fails with
http://localhost:9000/assets/lib/rxjs/rx.js Failed to load resource: the server responded with a status of 404 (Not Found)
zone.min.js:1 Error: (SystemJS) Error: XHR error (404 Not Found) loading http://localhost:9000/assets/lib/rxjs/rx.js(…)e.invoke @ zone.min.js:1
I have successfully build my play application with Angular front-end thanks to your project template.
Now I search to test my code Typescript code using karma and jasmine. I have see you have a test
directory and you import jasmine-core
and types__jasmine
but I don't know how to use it with sbt. Is it possible or need I use external command ?
EDIT: Maybe it was helpfull to use sbt-mocha instead of karma but I got an Error: Cannot find module 'internal/fs'
Would it be possible to make a maven version of this project? I wouldn't mind getting my hands dirty trying this but would need some guidance on how to migrate. Any help is appreciated. Thanks!
Hi, I've created a template project from the sbt new
command and try to run it with sbt run
.
It started successfully but when I open it in browser, there occured the error in console:
TypeError: Subject_1.Subject is not a constructor
at new HeroSearchComponent (hero-search.component.js:47)
at createClass (core.umd.js:10960)
at createDirectiveInstance (core.umd.js:10788)
at createViewNodes (core.umd.js:12229)
at callViewAction (
It seems that the rxjs is not loaded in runtime. But I've found it in the source assets/lib/rxjs
. I don't know why. Wish that I can get some help from you. Many thanks!
Not sure if this is the appropriate way to ask questions, but I can't find a way to run the typescript tests in test/assets/* could you explain how to run these tests?
how to use libarary.such as ng2-bootstrap
To reproduce:
sbt run
scala todos:Array
\play-angular2-typescript\app\assets\app\services\store.ts:11: TS2314 Generic type 'Array<T>' requires 1 type argument(s).
- and the browser (play) correctly stops and displays the page 'Compilation error' - all goodThis can be quite confusing, especially when, say, you make a bad change to a source file, an ajax hit fires for some other reasone and gets the compile error, and now your manual browser refresh would appear to indicate, that your code-change was good.
Hi,
I'm very interested by this plugin.
Running the sample I get :
JsTaskFailure: /Users/laguiz/temp/play-angular2-typescript/project/target/typescript/sbt-typescript-0.2.2.jar:121
var tsConfig = ts.convertCompilerOptionsFromJson(unparsedCompilerOptions, options.tsconfigDir, "tsconfig.json");
^
TypeError: ts.convertCompilerOptionsFromJson is not a function
at compile (/Users/laguiz/temp/play-angular2-typescript/project/target/typescript/sbt-typescript-0.2.2.jar:121:23)
at Object.<anonymous> (/Users/laguiz/temp/play-angular2-typescript/project/target/typescript/sbt-typescript-0.2.2.jar:109:21)
at Module._compile (module.js:413:34)
at Object.Module._extensions..js (module.js:422:10)
at Module.load (module.js:357:32)
at Function.Module._load (module.js:314:12)
at Function.Module.runMain (module.js:447:10)
at startup (node.js:140:18)
at node.js:1001:3
Hello,
Congratulations for your job...
I have a problem trying to use it, when I try to config "angular2/router" an error occurs, the folowing error:
=> "NetworkError: 404 Not Found - http://localhost:9000/angular2/router" <=
Do you have any idea about this?
thanks.
Hi,
When I follow the instructions I get the following error:
[info] Loading project definition from /home/blr/telugunewsfeed/play-angular2-typescript/project
[info] Updating {file:/home/blr/telugunewsfeed/play-angular2-typescript/project/}play-angular2-typescript-build...
[info] Resolving org.fusesource.jansi#jansi;1.4 ...
[info] Done updating.
[info] Set current project to play-angular2-typescript (in build file:/home/blr/telugunewsfeed/play-angular2-typescript/)
[info] Updating {file:/home/blr/telugunewsfeed/play-angular2-typescript/}root...
[info] Done updating.
--- (Running the application, auto-reloading is enabled) ---
[info] p.c.s.NettyServer - Listening for HTTP on /0:0:0:0:0:0:0:0:9000
(Server started, use Ctrl+D to stop and go back to the console...)
[info] Compiling 8 Scala sources and 1 Java source to /home/blr/telugunewsfeed/play-angular2-typescript/target/scala-2.11/classes...
[success] Compiled in 4s
[info] Typescript compiling on 3 source(s)
[info] Typescript linting on 3 source(s)
[error]
[error] module.js:340
[error] throw err;
[error] ^
[error] Error: Cannot find module 'sprintf-js'
[error] at Function.Module._resolveFilename (module.js:338:15)
[error] at Function.Module._load (module.js:280:25)
[error] at Module.require (module.js:364:17)
[error] at require (module.js:380:17)
[error] at Object.<anonymous> (/home/blr/telugunewsfeed/play-angular2-typescript/target/web/node-modules/main/webjars/codelyzer/componentClassSuffixRule.js:8:20)
[error] at Module._compile (module.js:456:26)
[error] at Object.Module._extensions..js (module.js:474:10)
[error] at Module.load (module.js:356:32)
[error] at Function.Module._load (module.js:312:12)
[error] at Module.require (module.js:364:17)
[info]
com.typesafe.sbt.jse.SbtJsTask$JsTaskFailure:
module.js:340
throw err;
^
Error: Cannot find module 'sprintf-js'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (/home/blr/telugunewsfeed/play-angular2-typescript/target/web/node-modules/main/webjars/codelyzer/componentClassSuffixRule.js:8:20)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.