cmichaelgraham / aurelia-typescript Goto Github PK

I've been working with Aurelia for a couple of months and now our project requires to include ESRI maps.

I'm having trouble including the maps since I get an 'defineAlreadyDefined'. I know the error must be because my project uses AMD module loader (defined in tsconfig) and Dojo is based on AMD too, so it is defined two times.

Since I need to use AMD loader for the rest of my project, is there any way to avoid this error when using ESRI?

Thanks!

This is now the recommended way.

See blog
Section TypeScript 1.4 and Built-in compiler

Nice job!!
Thanks,
Dan

Test each of the browsers against the release and latest bundles. Record results. Investigate problems. Report aurelia issues where appropriate.

Michael,

I am trying to use a modified version of your wizard example, where I am hiding the next steps because certain traits of them may change, based upon the input given by the user in the earlier steps. I am having a problem with race conditions where when I execute the next() event on the wizard, it ends prior to the step/list item containing the step gets displayed, as a result the step does get displayed, and the router does not navigate to the new route. Do you have any suggestions on what steps I might take to address this. I am not sure where I might put a promise to delay the process of completing the next event until the list item gets rendered/shown.

Thanks,

Tony DiSalvo

Windows 7 x64
Typescript Beta 1.5
Phpstorm 9 EAP via gulp-typescript

getting typings\aurelia\aurelia-templating.d.ts(76,1): error TS1128: Declaration or statement expected.

Just this 1 error on compile, using current master branch mater folder/typings d.ts files https://github.com/cmichaelgraham/aurelia-typescript/tree/master/master/typings

Michael,
Sorry for cross-posting, but I posted a question on the sublime-text plugin repository regarding code completion in (aurelia) model files which might interest you as well. Would be great to hear your view on this as well.

microsoft/TypeScript-Sublime-Plugin#326

Thanks.
paul.

Hi,

If I create custom validation rule, like this

export class CustomValidationRule extends ValidationRule {
  constructor(threshold) {
    super(
        ...
    );
  }
}

ValidationGroupBuilder.prototype['prcbIsNumber'] = function () {
  return this.passesRule(new CustomValidationRule());
}

ValidationGroup.prototype['prcbIsNumber'] = function () {
  return this.builder.prcbIsNumber();
};

it will will be nice we can call it with statement like this

    this.validation.on(this.country, undefined).ensure('CSTLCNTRY').prcbIsNumber()
    // but this is not possible now 
    // I need to cast it to any to be able to do that
    (<any>this.validation.on(this.country, undefined)).ensure('CSTLCNTRY').prcbIsNumber()

there is solution but I need to rewrite aurelia-validation.d.ts every time when it is published

declare module 'aurelia-validation/validation/validation-group' {
    /**
     * Encapsulates validation rules and their current validation state for a given subject
     * @class ValidationGroup
     * @constructor
     */
    export interface IValidationGroup {
        // ...

            /**
         * Instantiates a new {ValidationGroup}
         * @param subject The subject to evaluate
         * @param observerLocator The observerLocator used to monitor changes on the subject
         * @param config The configuration
         */
        new(subject: any, observerLocator: any, config: any);

        // ...

        /**
         * Specifies that the execution of the previous validation rule should use the specified error message if it fails
         * @param message either a static string or a function that takes two arguments: newValue (the value that has been evaluated) and threshold.
         * @returns {ValidationGroup} returns this ValidationGroup, to enable fluent API
         */
        withMessage(message: any): any;
    }

    export var ValidationGroup : IValidationGroup;
}

then I can define my validation.d.ts

declare module "aurelia-validation/validation/validation-group" {
  export interface IValidationGroup {
    prcbIsNumber():IValidationGroup
  }
}

links:

http://stackoverflow.com/questions/23217334/how-do-i-extend-a-typescript-class-definition-in-a-separate-definition-file

microsoft/TypeScript#819

Can you please support @types?
https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files/

Hi,

I am trying to compile the get started example with WebStorm and TypeScript 1.5.

I am using the old d.ts and I had to change three imports, one of them is:
import Logging = require('aurelia-logging')
changed to
import * as Logging from 'aurelia-logging';

The syntax errors have gone but when I try to compile the app.js:

//

import {inject} from 'aurelia-framework';
import {Router} from 'aurelia-router';
import 'bootstrap';
import 'bootstrap/css/bootstrap.css!';

@Inject(Router)
export class App {
constructor(private router) {
this.router = router;
this.router.configure(config => {
config.title = 'Aurelia';
config.map([
{ route: ['','welcome'], moduleId: './welcome', nav: true, title:'Welcome' }
]);
});
}
}

I receive the error:
Error:(3, 9) TS2305: Module '"aurelia-framework"' has no exported member 'inject'.

When there will be an aurelia.d.ts for the new version aurelia with ES7 decorators.

Thanks

Is there a master aurelia.d.ts against which you would like a PR? Or I could put my changes into one of the VS/TS solutions (skel?) and share it that way.

I see you are trying a process to generate the file - so are manual updates even something you are interested in?

Since all modules are contained in a bundle, how does one specify a plugin module?

I was trying to add 'aurelia-animator-css' plugin but since it's located within the aurelia-bundle, I am not sure how to point to it.

Would I have to bring in a copy of separate module just to be able to include it as a plugin?

enhance bundling and deployment script to include a bundle for the latest libraries.

port sample to ts15 beta (on ts 15 branch)

I run VS2013 with update 4 and the Typescript 1.4 for VS 2013.

I rebuild the solution without errors and start the project with chrome.

But nothing starts... instead it hangs in VS2013.

sdfsdfsadfsdf

make sure that all of the current types are represented in the .ts files so they end up in the generated .d.ts files.

Build:Module 'aurelia-binding' has already exported a member named 'Callable'. Consider explicitly re-exporting to resolve the ambiguity.

Kind of a shame, since this is about the only official project for VS using TypeScript I can find.

Would be lovely in we could install Aurelia simply via tsd

https://github.com/DefinitelyTyped/tsd/

What is the reason these DTs are not on http://definitelytyped.org yet?

Currently the ~\aurelia-typescript\skel-nav-esri-vs-ts\skel-nav-esri-vs-ts\skel-nav-esri-vs-ts.csproj file specifies the following additional flags to enable decoratorMetadata and decorators in the emit using the following element:

<TypeScriptAdditionalFlags> $(TypeScriptAdditionalFlags) --emitDecoratorMetadata --experimentalDecorators </TypeScriptAdditionalFlags>

This doesn't work well with the TypeScript language service in Visual Studio, so things like Compile on Save won't produce the correct output, and you'll see errors in the editor.

If you replace that element with the following 2 elements, the language service will work as expected:

<TypeScriptExperimentalDecorators>true</TypeScriptExperimentalDecorators>
<TypeScriptEmitDecoratorMetadata>true</TypeScriptEmitDecoratorMetadata>

Hi,

Here is another way to bootstrap aurelia

        var origin = window.location.origin;
        var pathname = window.location.pathname;
        var baseUrl = origin + pathname.toLowerCase().replace("index-latest.html", "");
        // var baseUrl = "http://localhost:62960";
        require.config({
            baseUrl: baseUrl,
            paths: {
                aurelia: baseUrl + "/scripts/aurelia",
                webcomponentsjs: baseUrl + "/scripts/webcomponentsjs",
                views: baseUrl + "/views",
                underscore: baseUrl + "/scripts/underscore/underscore.min",
                three: baseUrl + "/scripts/three/three"
            },
            bundles: {
                'aurelia/aurelia-bundle-latest': ['aurelia-bootstrapper', 'aurelia-loader-default']
            },
            shim: {
                three: {
                    exports: "THREE"
                },
                underscore: {
                    exports: "_"
                },
                'aurelia-bootstrapper':{
                    deps: ['aurelia-loader-default']
                }
            }
        });

        require(["aurelia-bootstrapper"]);

or without any require([])

        var origin = window.location.origin;
        var pathname = window.location.pathname;
        var baseUrl = origin + pathname.toLowerCase().replace("index-latest.html", "");
        // var baseUrl = "http://localhost:62960";
        require.config({
            baseUrl: baseUrl,
            deps: ['aurelia-bootstrapper'],
            paths: {
                aurelia: baseUrl + "/scripts/aurelia",
                webcomponentsjs: baseUrl + "/scripts/webcomponentsjs",
                views: baseUrl + "/views",
                underscore: baseUrl + "/scripts/underscore/underscore.min",
                three: baseUrl + "/scripts/three/three"
            },
            bundles: {
                'aurelia/aurelia-bundle-latest': ['aurelia-bootstrapper', 'aurelia-loader-default']
            },
            shim: {
                three: {
                    exports: "THREE"
                },
                underscore: {
                    exports: "_"
                },
                'aurelia-bootstrapper': {
                    deps: ['aurelia-loader-default']
                }
            }
        });

Develop a script to pull the latest aurelia libraries.

update docs to reflect ts 15 port changes

Why do you keep all these skeleton apps in one repo? Why not divide them into their own repo.
Would like to be able to take a skeleton app for gulp standalone and work from there just by cloning a repo or running a yo generator similar to the navigation-app. Even better, choose TypeScript or not depending on generator argument/CLI choice. How about that!

I also notice that dependencies for skel-nav-esri-gulp look very dated and that the /aurelia folder and /styles folder seem to contain the entire aurelia code base from some point in the past. Why not just reference them via jsmp in the System config.js file (which is missing :P) ?
Would love to help out to resolve this :)

Cheers!

Hi,

I tried to use your code and modify the id at run time, it works fine for the first one. However does not modify it for others. The show works fine though. Any idea why it isnt changing the id for others?

if (router.navigation[routeIndex].settings["level"] === nextLevel) {
                    router.navigation[routeIndex].settings["show"] = true;
                    router.navigation[routeIndex].href = router.navigation[routeIndex].href.replace(":id", id);
                  }

router

config.map([
            { route: ['', 'products'], title: 'Products', name: 'products', moduleId: 'products' ,nav: true, settings: { level: 0, show: true }},  
        { route: ['product/:id'], name: 'contents', href: '#/product/:id',  moduleId: 'contents', nav: true, settings: { level: 1, show: false }, title: 'Contents',  },
            { route: ['product/:id/details'],  href: '#/product/:id/details', name: 'details', moduleId: 'details',
                                                                                 nav: true, title: 'Details', settings: { level: 1, show: false }},
            { route: ['product/:id/ware-house'],  href: '#/product/:id/warehouse', name: 'warehouse', moduleId: 'warehouse',
                                                                                   nav: true, title: 'Warehouse', settings: { level: 1, show: false }},
        ]);

Thanks

I started out enhancing then nav-bar menu with dropdowns, but found that the nav-bar is not working as it should. also from this site the nav-bar is not working (dropdown)
http://cmichaelgraham.github.io/aurelia-typescript/skel-nav-esri-vs-ts/index-release.html#
make the window smaller so the nav-bar becomes a dropdown to see the problem.

http://aurelia.io/docs.html#the-screen-activation-lifecycle

Hi.

I think the signature for this https://github.com/cmichaelgraham/aurelia-typescript/blob/master/skel-nav-esri-vs-ts/skel-nav-esri-vs-ts/typings/aurelia/aurelia.d.ts#L184 method should be something like the following.

interface IPromise<T> {
    then<U>(callback: (response: T) => U): IPromise<U>;
}

I have converted tests to TypeScript / Gulp and I used your aurelia.d.ts. With the current implementation the compiler would give the error.

src/test/unit/flickr.spec.ts(26,20): 2339 Property 'then' does not exist on type 'void'

Unfortunately I do not have Visual Studio, so I cannot check it against your repository. That's why I am raising this as an issue rather than a pull request.

Cheers.

For each solution, copy the index.html page to index-new.html and reference the bundle that has the latest aurelia libraries. update the sample list to be able to launch either version.

Are these templates chrome only ? Because no instruction given for IE. Nor it does work. What can I do ?

Hi
I have a problem with aurelia-require-bundle.
When I run

node r.js -o name=aurelia-bundle-manifest baseUrl=. mainConfigFile=main-config.js out=aurelia-bundle.js optimize=none

I get exception:

Tracing dependencies for: aurelia-bundle-manifest Error: ENOENT, no such file or directory 'F:\aurelia\aurelia-typescript\aurelia-require-bundle\sightglass.js' In module tree: aurelia-bundle-manifest aurelia-loader/index aurelia-loader/loader core-js/core.src

I'm new to all of this code (aurelia, TS, requirejs) and I don't know where I've made a mistake.
I think core.src.js file is a bundle and have inside core.js, sightglass.js and rivets.patched.js
I don't know what and why is looking for sightglass.js file.
When I put sightglass.js file to my base directory then node r.js command is OK, but file aurelia-bundle.js has duplicated sightglass.js code.

port sample to ts15beta (on ts 15 branch)

Currently aurelia.d.ts generates a ton of warnings when used in a noImplicitAny: true project.

It shouldn't be a hard fix because looking at the file:

• 95% are methods that lack a : void return type.
• 5% are paramters that probably should be explicit : any.

ValidationGroup's methods such ensure, isNotEmpty and others in aurelia-validation.d.ts specifies a return value of any even though the comment states

   "* @returns {ValidationGroup} returns this ValidationGroup, to enable fluent API"

More errors, thanks for working on these

Windows 7 x64
Phpstorm 9 EAP
compiled via gulp-typescript 2.7.7 using typescript 1.5 beta

typyings folder from your master branch master typings folder
typings\aurelia\aurelia-templating.d.ts(62,18): error TS2314: Generic type 'Array<T>' requires 1 type argument(s).
typings\aurelia\aurelia-templating.d.ts(62,26): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(63,28): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(64,29): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(319,31): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(320,29): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(321,26): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(322,29): error TS1039: Initializers are not allowed in ambient contexts.
typings\aurelia\aurelia-templating.d.ts(323,31): error TS1039: Initializers are not allowed in ambient contexts.
typings\es6.d.ts(1136,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(1419,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(1992,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(2275,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(2558,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(2841,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(3124,5): error TS2375: Duplicate number index signature.
typings\es6.d.ts(3407,5): error TS2375: Duplicate number index signature.

Side note#
I am assuming the es6.d.ts will eventually go away and we will just use the one included in official typescript bin folder called lib.es6.d.ts when it has the missing es6 functions. One strange thing I noted is that if I delete your es6.d.ts file I get errors about not finding Promise, but looking at the official typscript lib.es6.d.ts Promise is defined

Been reading your blog post and was excited to get started with Aurealia and TS, however...

I wish you would split this repo into more repos, at least group them in some logical fashion: one for Visual Studio, One for skeleton app etc. How would I start a skeleton project using Sublime Text 3?
Looks like there is also specific support for Atom IDE. How about Webstorm?

At least make it more clear in the README, perhaps move the Visual Studio specifics at least to the Wiki for now? Then have a Geting started section for each Editor/IDE supporting TypeScript ;)
I would be glad to help out... Cheers!