Giter Club home page Giter Club logo

dotnet's Introduction

Aurelia

License: MIT npm version CircleCI TypeScript Twitter

Backers on Open Collective Sponsors on Open Collective Discord Chat

Aurelia 2

This is the Aurelia 2 monorepo, containing core and plugin packages, examples, benchmarks, and documentation for the upcoming major version of everybody's favorite modern JavaScript framework, Aurelia.

Introduction

Aurelia is a modern, front-end JavaScript framework for building browser, mobile, and desktop applications. It focuses on aligning closely with web platform specifications, using convention over configuration, and having minimal framework intrusion. Basically, we want you to just write your code without the framework getting in your way. ๐Ÿ˜‰

Aurelia applications are built by composing a series of simple components. By convention, components are made up of a vanilla JavaScript or Typescript class, with a corresponding HTML template.

//app.js
export class App {
  welcome = "Welcome to Aurelia";

  quests = [
    "To seek the holy grail",
    "To take the ring to Mordor",
    "To rescue princess Leia"
  ];
}
<!-- app.html -->
<form>
  <label>
    <span>What is your name?</span>
    <input value.bind="name & debounce:500">
  </label>

  <label>
    <span>What is your quest?</span>
    <select value.bind="quest">
      <option></option>
      <option repeat.for="q of quests">${q}</option>
    </select>
  </label>
</form>

<p if.bind="name">${welcome}, ${name}!</p>
<p if.bind="quest">Now set forth ${quest.toLowerCase()}!</p>

This example shows you some of the powerful features of the aurelia binding syntax. To learn further, please see our documentation.

Feeling excited? Check out how to use makes to get started in the next section.

Note: Please keep in mind that Aurelia 2 is still in beta. A number of features and use cases around the public API are still untested and there will be a few more breaking changes.

Getting Started

First, ensure that you have Node.js v8.9.0 or above installed on your system. Next, using npx, a tool distributed as part of Node.js, we'll create a new Aurelia 2 app. At a command prompt, run the following command:

npx makes aurelia

This will cause npx to download the makes scaffolding tool, along with the aurelia generator, which it will use to guide you through the setup process. Once complete, you'll have a new Aurelia 2 project ready to run. For more information on Aurelia's use of makes, see here. If you aren't interested in taking our preferred approach to generating a project, you can also see the examples folder in this repo for pure JIT setups (no conventions) with various loaders and bundlers.

Documentation

You can read the documentation on Aurelia 2 here. Our new docs are currently a work-in-progress, so the most complete documentation is available in our getting started section. If you've never used Aurelia before, you'll want to begin with our Quick Start Guide.

Contributing

If you are interested in contributing to Aurelia, please see our contributor documentation for more information. You'll learn how to build the code and run tests, how best to engage in our social channels, how to submit PRs, and even how to contribute to our documentation. We welcome you and thank you in advance for joining with us in this endeavor.

Staying Up-to-Date

To keep up to date on Aurelia, please visit and subscribe to the official blog and our email list. We also invite you to follow us on twitter. If you have questions, have a look around our Discourse forum. For chat on Aurelia 2, join our new Aurelia 2 community on Discord. If you'd like to join the growing list of Aurelia sponsors, please back us on Open Collective.

License

Aurelia is MIT licensed. You can find out more and read the license document here.

dotnet's People

Contributors

brandonseydel avatar eisenbergeffect avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Forkers

airboss001

dotnet's Issues

Websockets is out of control!

So, I created a very basic project with the following lines

dotnet new -i aurelia-dotnet-templates
dotnet new aurelia -ht http2 -c sass -e none

I opened the solution in VS2017 and ran it using IIS Express. The page loads.

However, if I open dev tools as the page is loading, the Network information is going nuts with tons of websocket requests. There is nothing in app code that makes any kind of POST request and yet there are tons of POST requests being made in the Network area.

This activity goes on long after the page has loaded. In the end, the status bar indicates that 3.84MB of 3.88MB was transferred -- interesting since the entire dist folder is only 1MB. It also states there were 192 requests made -- my dist folder only has 22 files in it and the largest file is 107KB.

I'm very curious where all this extra activity and data is coming from.

Script 'au run' exited without indicating that the node server was listening

I just used the latest template (and it did indeed remove the Dependencies Error that I was getting previously).

I created a new directory and then did the following:

dotnet new -i aurelia-dotnet-templates
dotnet new aurelia -ht http2 -c sass -e none

I then went into the ClientApp directory and ran npm install. Next, I clicked the IIS Express button in VS2017 to launch the app in IIS Express. The app launches just fine and I get Hello World.

I clicked the Stop button to stop the app. I changed the browser from Chrome to FireFox and again clicked the IIS Express button. This time, the browser displays an error page:

image

I never had this happen in the previous version of the template. (Incidentally, it doesn't matter if I switch back to Chrome or not -- it appears as though I get one chance to run in whatever browser and then the app will no longer run.)

So, this leaves me in a state where I can no longer run the app until I restart my machine. After restart, I can run the app one time before getting the same thing.

After creating a project, I get a Dependencies Error

I created a project using the following:

dotnet new -i aurelia.dotnet.templates
dotnet new aurelia -b webpack -t typescript -e none -ht http2 -c sass -p typical

I opened the project in VS 2017 and I see the little yellow triangle on the Dependencies area. If I open that up, I see the following error under Dependencies\NuGet\Aurelia.DotNet (1.0.0)

 Project dependency Aurelia.DotNet does not contain an inclusive lower bound.  Include a lower bound in the dependency version to ensure consistent restore results.

Based on the message, I'm guessing that is something that needs to be done in the aurelia/dotnet project as opposed to something I need to do in my code correct?

Cannot find module '@babel/polyfill'

I installed the latest version of the templates: dotnet new -i aurelia.dotnet.templates

I then created a new folder and within the folder did the following dotnet new aurelia

Once that was completed, I then did an npm install to ensure all my packages were loaded. I then ran the project (which should be a very basic Hello World) and I get an error stating that

Cannot find module '@babel/polyfill'

The error occurs during the webpack build of main.ts.

What do I need to do to get this working? I kind of figured the initial template would just work out of the box.

I also tried: au build and got the following

image

I tried npm install babel-polyfill but that didn't fix anything.

System.TimeoutException: The aurelia cli server did not start listening for requests within the timeout period

Info:

node version = v16.13.1

Output

Application started. Press Ctrl+C to shut down.
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
Request starting HTTP/1.1 DEBUG http://localhost:50696/ 0
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
Request starting HTTP/1.1 GET http://localhost:44357/
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
Request finished in 44.9508ms 200
fail: Aurelia.Tools.DotNet.Extensions[0]
[webpack-dev-server] Project is running at:
fail: Aurelia.Tools.DotNet.Extensions[0]
[webpack-dev-server] Loopback: http://localhost:8080/
fail: Aurelia.Tools.DotNet.Extensions[0]
[webpack-dev-server] On Your Network (IPv4): http://192.168.50.229:8080/
... Snip Snip ..
fail: Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware[1]
An unhandled exception has occurred while executing the request.
System.TimeoutException: The aurelia cli server did not start listening for requests within the timeout period of 50 seconds. Check the log output for error information.
at Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout[T](Task1 task, TimeSpan timeoutDelay, String message) at Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.PerformProxyRequest(HttpContext context, HttpClient httpClient, Task1 baseUriTask, CancellationToken applicationStoppingToken, Boolean proxy404s)
at Microsoft.AspNetCore.Builder.SpaProxyingExtensions.<>c__DisplayClass2_0.<b__0>d.MoveNext()
--- End of stack trace from previous location where exception was thrown ---
at Microsoft.AspNetCore.Routing.EndpointMiddleware.Invoke(HttpContext httpContext)
at Microsoft.AspNetCore.Routing.EndpointRoutingMiddleware.Invoke(HttpContext httpContext)
at Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware.Invoke(HttpContext context)
at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
Request finished in 50187.6852ms 500 text/html; charset=utf-8

How to reproduce

dotnet new aurelia

It seems like the text "Project is running at" is being written to STDERR, but AureliaCliDevelopmentServer.StartCreateAureliaCliAppServerAsync waits for a match on STDOUT

Local HTTPS support

Hi,

I was trying to get aurelia to work with .net core 3.1 using this template with local HTTPS.
It works, but unfortunately I got a socket-js SSL error inside the browser console. After some research I found the following blogpost:
https://dnasir.com/2020/04/01/migrating-from-webpackdevmiddleware-to-spaservices-extensions/

Which describes the exact problem and solution. I tested the solution and it worked. Is it possible to make a fix for this. If you like I could make a pull request. The following changes are needed:

Inside [AureliaCliDevelopmentServer]https://github.com/aurelia/dotnet/blob/master/Aurelia.DotNet/AureliaCliDevelopmentServer.cs)
Row 99 change to:
task => new UriBuilder("http", "127.0.0.1", task.Result).Uri);

Inside webpack.config

devServer: { contentBase: outDir, // serve index.html for all 404 (required for push-state) historyApiFallback: true, host: '127.0.0.1', transportMode: 'ws' },

Thank you!

basic install setup

Wanted to put a few notes here on my experience trying to get this to run.

Here are the manual steps followed:
dotnet new -i aurelia.dotnet.templates
dotnet new aurelia -ht http2 -c sass -e none

Additional Steps:
cd ClientApp
npm i
au build

cd ../project.Spa
dotnet run
[failing messages, can't find ClientApp]

Troubleshooting steps:
Trying to do the command 'dotnet run' in the project.Spa directory now fails. It is looking for 'ClientApp' to be in the same directory, not on level up.

Moving ClientApp from the solution root into the 'project.Spa' directory now allows it to start and opening a browser to 'localhost:8080' loads the site.

I tried using the --secure and failed miserably, but that was before I discovered the above required steps. So I'll go back and try that.

Node process from Aurelia CLI is not shutdown

I've configured our solution to use spa.UseAureliaCliServer(). Starting up the solution in Debug Mode using Visual Studio or Visual Studio Code works great.
However, when I stop the solution in Visual Studio it stops the dotnet process but not the aurelia cli node process, leaving a zombie process running on the system.
Is there any solution for this?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.