kriasoft / aspnet-starter-kit Goto Github PK

Environment: MacOS 10.11.6

Installed yo and generator-aspnetcore and then created a new project. Ran "npm install".

Opened the project in Visual Code and entered "npm run"in the terminal, and the following was displayed:

bash-3.2$ npm start

[email protected] start /Users/krallen/Projects/DotNetCore/d2llontario
node run

Starting 'start'...
Starting 'clean'...
Finished 'clean' after 36ms
Starting 'appsettings'...
Finished 'appsettings' after 4ms
Error
at webpack (/Users/krallen/Projects/DotNetCore/d2llontario/node_modules/webpack/lib/webpack.js:19:9)
at resolve (/Users/krallen/Projects/DotNetCore/d2llontario/run.js:159:24)
at Promise.resolve.then.then.then (/Users/krallen/Projects/DotNetCore/d2llontario/run.js:156:17)
bash-3.2$

Line 19 of the Webpack.js file contains the line:

throw new WebpackOptionsValidationError(webpackOptionsValidationErrors);

This seems to come from the loading of a 'schema' file:

const webpackOptionsSchema = require("../schemas/webpackOptionsSchema.json");

I have not modified anything, so why should this be occurring?

when I ran this project I got this because of that I was not able get page.please help me with this issue

Create appveyor.yml file with instructions to AppVeyor how to lint, build and test the project.

Reference: https://www.appveyor.com/docs/appveyor-yml

When trying to run a migration using the ef core cli, from the server folder, I get the error: 'No executable found matching command "dotnet-ef" '.

According to the notes here (towards the bottom), the project.json needs updating:
https://blogs.msdn.microsoft.com/dotnet/2016/11/16/announcing-entity-framework-core-1-1/

It needs updating from "Microsoft.EntityFrameworkCore.Tools" to "Microsoft.EntityFrameworkCore.Tools.DotNet".

I have tested that this and it appears to work. I also read the rules surrounding pull requests and wasn't sure what some of it meant so thought I'd better log it here instead but I do have a fork with the working project.json in.

Thanks.

Hello, i have a problem with building application into the production. As far as i know, the output build should contain bundled css, js and html, which should be placed in the server. Unfortunately i cannot run build. Only the js files are created.
When i run npm run build i obtain error. I restored the packages but not it take no effect. The same problem is in "clean" project.
What seems to be the problem ?

In addition there is no html generated.

Hi,

I'm using this starter kit and it is awesome, but I am having trouble when I add a new library:
"jqwidgets-framework": "4.6.0",

This library is great and I have used it before pre-React. I am following their demo on http://www.jqwidgets.com/jquery-widgets-documentation/documentation/React/React.htm

import React from "react";
import JqxBarGauge from "jqwidgets-framework/jqwidgets-react/react_jqxbargauge";

class Grid extends React.Component {
render () {
return (
<JqxBarGauge width={600} height={600} colorScheme={"scheme02"} max={150}
values={[102, 115, 130, 137]} />
);
}
}

export default Grid;

But when I run webkit I get the following problem:

ERROR in ../~/jqwidgets-framework/jqwidgets-react/react_jqxbargauge.js
Module parse failed: C:\Code\Projects\Test\aspnet-starter-kit-vs-2015-master\node_modules\jqwidgets-framework\jqwidgets-react\react_jqxbargauge.js Unexpected token (235:6)
You may need an appropriate loader to handle this file type.
| let id = 'jqxBarGauge' + this.generateID() + this.generateID();
| this.componentSelector = id; return (
|

I have spent hours trying to figure this out, would anyone have an idea?

Thanks

Hey, great project! But I have a question regarding the .NET server vs the browser sync server. It seems like browsersync is running on port 5000 from the run.js file. Now what port is the .NET server running at?? I thought you were proxying the browsersync server to the .NET server but I don't think that's whats happening.

thanks

Do not see any comments from last June. Is development stopped on this project?

Hi, when i run this on Mac, it don't start and throw exception

System.IO.FileNotFoundException' in System.IO.FileSystem.dll
fail: Microsoft.AspNetCore.Server.Kestrel, Version=1.0.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60[13]

What do you think about extracting (1) webpack.config.js, (2) all the dev dependencies (~50), and automation scripts (build, run) into a stand-alone npm package (react-app)?

This way it might be easier for to keep your project based on ASP.NET Core Starter Kit template up to date, you just update react-app-tools dev dependency in your front-end project from time to time, which will ensure that you're using the latest and greatest configs and CLI tools ready to be used for building, running and testing your React application.

The package.json file in your project will look nice and clean, literally:

{
  "private": true,
  "dependencies": {
    "history": "^3.0.0",
    "react": "^15.2.1",
    "react-app": "^1.1.1",
    "react-dom": "^15.2.1",
    "react-redux": "^4.4.5",
    "redux": "^3.5.2",
    "whatwg-fetch": "^1.0.0"
  },
  "devDependencies": {
    "react-app-tools": "^1.1.1",
  },
  "scripts": {
    "build": "react-app build",
    "start": "react-app start",
  }
}

FAQ

• Will I be able to customize Babel, Webpack, Browsersync and other configs?
  Yes, there will be an easy way to extend/tweak the default configs (Webpack, Babel, PostCSS etc.)
• Will I be able to customize automation scripts?
  Yes, there will be an easy way to add or customize the existing scripts (build, run etc.)

Preview

https://github.com/kriasoft/react-app

Hi,

I'm trying to use @import in the css but I get an error 'Module not found. Example:

Layout.js
import s from './Layout.css';

Layout.css
@import "base/_variables";

When I replace the css import with "/base/_variables"; I no longer get the error but on page load the following shows up in the debug console:

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:3000/base/_variables".

I'm assuming it's an issue with the webpack config?

Any assistance would be greatly appreciated.

Thanks in advance!

https://aspnet-core.azurewebsites.net/

Hi,

I'm having a little trouble integrating the two projects. Admittidly, it may be due to my intermediary understanding of webpack.

I've created a sample project where I have included the semantic-ui npm module into this project, and have started to make some modifications to the webpack config, but it is failing. I was wondering if anyone could take a quick look and see whats happening. The project (temporarily) is here:

https://github.com/jasenf/aspnet-starter-react-semantic-ui

Essentially after adding the path for the semantic.css files to webpack, npm run build is blowing up.

Thanks!

I have an HttpGet method in HomeController which requires authorization with the [Authorize] attribute. I have created a custom authentication like this. I worked it out so it authorizes the user correctly, but the User attribute is null in the GET methods in routes.json:

"path": "/",
"view": "./views/home",
"chunk": "main",
"data": {
  "userStats": "GET /getchartdata/",
  "lastDisposal": "GET /getlastdisposal",
  "totalMonth": "GET /gettotalmonth"
}

Am I doing something wrong? How do I fix this?

I'm very new to react but have done quite a bit in asp.net core. Recently started learning react and I started with dotnet new reactredux which is one of the spa templates for asp.net core as documented here: https://blogs.msdn.microsoft.com/webdev/2017/02/14/building-single-page-applications-on-asp-net-core-with-javascriptservices/

All the spa templates in dotnet new are using typescript and I would also like to use typescript. However the templates in dotnet new are a bit out of date, especially using react-router 2.x. rather than 4.x I have been trying to update the template to use react-router 4.x with redux but being new to react I am struggling a bit, so I decided to google for more react aspnet core starter kits and found this project which looks much more up to date and more of a real world example.

If this starter used typescript it would have everything I've been looking for, so wondering have you considered or would you consider integrating typescript into this kit? I understand if not but it never hurts to ask.

When creating a new project and running node run, i receive the following error:

c:\Projects\MyApp>node run
Starting 'start'...
Starting 'clean'...
Finished 'clean' after 11ms
Starting 'appsettings'...
Finished 'appsettings' after 9ms
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

• configuration has an unknown property 'postcss'. These properties are valid:
  object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? }
  For typos: please correct them.
  For loader options: webpack 2 no longer allows custom properties in configuration.
  Loaders should be updated to allow passing options via loader options in module.rules.
  Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
  plugins: {
  new webpack.LoaderOptionsPlugin({
  // test: /.xxx$/, // may apply this only for some modules
  options: {
  postcss: ...
  }
  })
  }
  at webpack (c:\Projects\MyApp\node_modules\webpack\lib\webpack.js:16:9)
  at resolve (c:\Projects\MyApp\run.js:159:24)
  at Promise.resolve.then.then.then (c:\Projects\MyApp\run.js:156:17)

At least on my OSX install the following command fails. I have attached all the information I know

the mentioned file " /Users/mwatts/tmp/try.aspnet-starter/MyApp/npm-debug.log" does not exist.

>npm start

[21:18:40] Starting 'start'...
Time: 5156ms
                           Asset     Size  Chunks             Chunk Names
    main.js?cbd653dd2e9a56f5e8e9   938 kB       0  [emitted]  main
main.js.map?cbd653dd2e9a56f5e8e9  1.08 MB       0  [emitted]  main
events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: spawn dotnet ENOENT
    at exports._errnoException (util.js:1007:11)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:182:32)
    at onErrorNT (internal/child_process.js:348:16)
    at _combinedTickCallback (internal/process/next_tick.js:74:11)
    at process._tickCallback (internal/process/next_tick.js:98:9)

npm ERR! Darwin 15.5.0
npm ERR! argv "/usr/local/Cellar/node/6.2.1/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v6.2.1
npm ERR! npm  v3.9.6
npm ERR! code ELIFECYCLE
npm ERR! [email protected] start: `node tools/start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script 'node tools/start'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the app package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node tools/start
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs app
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls app
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/mwatts/tmp/try.aspnet-starter/MyApp/npm-debug.log

What is your preferred code style from these two:
(prefix private fields with _, then reference them without using this.)

public class UserStore
{
    private readonly ApplicationDbContext _db;

    public UserStore(ApplicationDbContext db)
    {
         _db = db;
    }

    public IQueryable<User> Users
    {
        get { return _db.Users; }
    }

    public Task CreateAsync(User user)
    {
        _db.Users.Add(user);
        return SaveChanges();
    }
}

or

public class UserStore
{
    private readonly ApplicationDbContext db;

    public UserStore(ApplicationDbContext db)
    {
         this.db = db;
    }

    public IQueryable<User> Users
    {
        get { return this.db.Users; }
    }

    public Task CreateAsync(User user)
    {
        this.db.Users.Add(user);
        return this.SaveChanges();
    }
}

Does anyone know a tidy way to import / create this in Visual Studio 2015.
At work we use VS2015 Enterprise and am unable to download VS Code.

I have tried "New Project from Existing files" but you cannot select a ASP.NET core project type and any other type has trouble with dependencies (even after manually running npm install)

I whipped out my personal laptop and installed VS Core and it worked fine, just cannot find a way to open it in Visual Studio 2015, any ideas ?

Thanks in advance.

Looks like there is no support for authentication - how would you go about it? I'm only concerned about the universal rendering of views.

There is a message after the execution of the command. How to solve the great project

log : Restoring packages for /Users/lzz/Documents/projects/weixinapp/buddhism/server.test/project.json...
log : Restoring packages for /Users/lzz/Documents/projects/weixinapp/buddhism/server/project.json... Segmentation fault: 11

I have updated all the dependencies to the latest versions in my fork here: https://github.com/joeaudette/aspnet-starter-kit

it required some changes because of breaking changes in history, ie useQuery no longer exists.
it also required some changes in webpack.config.js for things that broke relating to postcss.

everything seems to be working though a some errors reported by running npm run eslint

I would make a pull request if you are interested?

First great works, and thanks.

1. dotnet can do server side rendering also, and it has great design-time environment. The reactjs server side rendering is a little bit duplicate in this case, and makes me feel a little bit uncomfortable.
2. is es2015-webpack used at all?
3. I added some new launch settings, if you feel usefull, please incorporate it into the project
   {
   "name": "Node- build server, and debug build client",
   "type": "node",
   "request": "launch",
   "program": "${workspaceRoot}/run.js",
   "stopOnEntry": true,
   "args": ["build", "--debug"],
   },
   {
   "name": "Node- run client with DEBUG and HMR, start server.",
   "type": "node",
   "request": "launch",
   "program": "${workspaceRoot}/run.js",
   "args": ["start"],
   },

Thanks

https://github.com/kriasoft/AspNet-Server-Template/blob/master/src/App.Database/Reference%20Data/User.sql#L7

Right now you have to specify hash manually for password you are using and for beginners no easy way to start testing boilerplate code.

Hi!

I've just discovered this starter kit while I was searching something to kick start with asp.net core + react. I haven't dug deep but the first thing I encountered is that a created project is based on the old stack of netcore1.0 and dnx. Is there any plans to update the template to netcore2.0?

Anyway a generated project fails to build:

Configuring...
-------------------
A command is running to initially populate your local package cache, to improve restore speed and enable offline access. This command will take up to a minute to complete and will only happen once.
Decompressing 100% 7216 ms
Expanding 100% 16302 ms
Failed to create prime the NuGet cache. new failed with: -2147352571
MSBUILD : error MSB1008: Only one project can be specified.
Switch: server.test

For switch syntax, type "MSBuild /help"
npm ERR! code ELIFECYCLE

I have netcore2.0 sdk installed obviously.

Since the server project was updated to .csproj and the new sdk, currently when I try to use the dotnet run command it fails and reports project.json is missing. project.json is no longer used since the update to ,csproj and vs2017 tooling, but the global.son indicates that it needs the older sdk so dotnet run fails since the older sdk used project.json. I deleted the global.json file in my copy and now dotnet run command works as it should, in the absence of that file it uses the newest installed sdk .

https://github.com/koistya/aspnet-starter-kit - work-in-progress, so far looking for good ideas to implement and your comments.

Hi,

There is a typo in AspNet-Server-Template/src/App.Server/Data/UserStore.cs in method AddLoginAsync at line 148.
Instead of
userLogin.LoginProvider = login.ProviderKey;
would be
userLogin.LoginProvider = login.LoginProvider;

It makes using external logins unusable.

Cheers,
Marton

After node run
I get 'Couldn't find a project to run. Ensure a project exists in .\Server"

Clean install on [email protected] then a clean installing yo and generator-aspnetcore fails.

Tried both methods of installation... copying files and yo...

Either way I get this error when I run npm start.

`Starting 'start'...
Starting 'clean'...
Finished 'clean' after 0ms
Starting 'appsettings'...
Finished 'appsettings' after 0ms
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

• configuration has an unknown property 'postcss'. These properties are valid:
  object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? }
  For typos: please correct them.
  For loader options: webpack 2 no longer allows custom properties in configuration.
  Loaders should be updated to allow passing options via loader options in module.rules.
  Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
  plugins: {
  new webpack.LoaderOptionsPlugin({
  // test: /.xxx$/, // may apply this only for some modules
  options: {
  postcss: ...
  }
  })
  }
  at webpack (C:\Users\simon\REACT\ASPNET CORE REACT REDUX STARTER KIT\STARTER KIT CLONE\node_modules\webpack\lib\webpack.js:16:9)
  at resolve (C:\Users\simon\REACT\ASPNET CORE REACT REDUX STARTER KIT\STARTER KIT CLONE\run.js:159:24)
  at Promise.resolve.then.then.then (C:\Users\simon\REACT\ASPNET CORE REACT REDUX STARTER KIT\STARTER KIT CLONE\run.js:156:17)

I have what I would consider a bog standard windows 10 system. I am using node.js v 6.6.0 and npm 3.10.8

I have no idea how to fix this...

Runtime

Microsoft .NET Core 1.0 Runtime (x86)
Microsoft .NET Core 1.0 Runtime (x64)
Microsoft .NET Core 1.0 Windows Server Hosting

SDK

Microsoft .NET Core VS 2015 Tooling Preview 2
Microsoft .NET Core SDK Preview 2 (x86)
Microsoft .NET Core SDK Preview 2 (x64)

What's the point of bundling .net core together with frontend such as react/angular & webpack? Is it just to ease publication/development? Shouldn't they be mutually exclusive and communicating via. restful api's?

I notice these great boilerplates such as this where you combine both the server-side .net core together with webpack + angular/react for example. Is this to achieve intellisense, easier publication/distribution? Or what exactly is the purpose?

Thanks!

When running node run I am getting a few errors. When I first run the command I am getting this:

I then put 'use strict'; at the top of run.js and am able to get further, but still run into this error:

Not sure if these are just linting errors or what's going on.

I am new to react, I don't mean this as criticism of this project, but is it considered normal to start with a bundle > 500kb before you even really begin building a react app?

when I do npm run build I see the output main.js is 511kb and even the cli shows it in yellow [big] as a warning, and that is minified. If I do node run the file is 1.68 MB unminified.

it seems big for boilerplate code that is just a starting point for building an app, is this considered normal in the react world?

• Create /client/components/Button UI component powered by React and MDL
• Put <Button>Login with Facebook</Button> in the header (see /client/components/Layout)
• Clicking on this button should trigger an HTTP POST request to /login/facebook

Is there a Vs2015 version?

Hi,
I have just checked this recipe https://github.com/kriasoft/aspnet-starter-kit/blob/master/docs/recipes/how-to-integrate-material-design-lite.md and recommends to use react-mdl.
Turns out the library is currently deprecated: https://github.com/react-mdl/react-mdl
Subsequently, react-mdl recommends to use https://github.com/material-components/material-components-web but I couldnt actually make it work.
Have you tried using material-components-web with the starter kit?

Thanks!

SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:968:3
npm-debug.log.zip