alexpods / angular2-universal-starter Goto Github PK

Could it be possible to edit/add meta tags (such as description, title, og:image and etc) in Universal?

Hi, I can run this directly and it works great with

node dist/private/app.js

but when i try to run it with

npm start

The app doesn't start, and the error log fills up with errors:

Error: Cannot find module '/home/bkinsey/opt/alexpods/angular2-universal-starter/dist/private/app.js'
    at Function.Module._resolveFilename (module.js:337:15)
    at Function.Module._load (module.js:287:25)
    at Function._load (/home/bkinsey/opt/alexpods/angular2-universal-starter/node_modules/pmx/lib/transaction.js:62:21)
    at Object.<anonymous> (/home/bkinsey/opt/alexpods/angular2-universal-starter/node_modules/pm2/lib/ProcessContainerFork.js:28:21)
    at Module._compile (module.js:425:26)
    at Object.Module._extensions..js (module.js:432:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Function.Module.runMain (module.js:457:10)
    at startup (node.js:136:18)
Error: Cannot find module '/home/bkinsey/opt/alexpods/angular2-universal-starter/dist/private/app.js'
    at Function.Module._resolveFilename (module.js:337:15)
    at Function.Module._load (module.js:287:25)
    at Function._load (/home/bkinsey/opt/alexpods/angular2-universal-starter/node_modules/pmx/lib/transaction.js:62:21)

[...]

Hi there,

I saw that your project using angular2-beta.15 and that issue #60 has been closed without any comment, so I'm wondering: do you plan to keep the project up-to-date?

I also saw that you use typings 0.6, and there are some breaking changes in the last version 1.0.4 (e.g. no ambient anymore, replaced by global...).

Regards

It would be just great if you can provide some ETA?

Seems like bundling is slow and unnecessary in dev mode. Any way to bypass webpack bunding in the dev mode, and just serve the files unbundled?

For prod builds it might be worthwhile to inline the templates. gulp has gulp-inline-ng2-template for instance. I'm not sure if it is possible to do the same via a webpack loader.

If you are interested, I would love to see postcss (for processing css files) in this project. There are a lot of very interesting postcss plugins available nowadays, it would be great to have the power and flexibility of tapping into these. Some of the plugins that intrigue me are:

• for future syntax css: http://cssnext.io/
• for flexbox in older browsers: https://github.com/10up/flexibility (https://github.com/7rulnik/postcss-flexibility)

I found a reason why i have added es6-shim, es6-promise and reflect-metadata into my previous PR to package.json file.

When i'm run npm start i've got the following DLL error:

ERROR in dll vendor
Module not found: Error: Cannot resolve module 'es6-shim'
Module not found: Error: Cannot resolve module 'es6-promise'
Module not found: Error: Cannot resolve module 'reflect-metadata'

I need to pre-render certain routes for SEO purposes and host my universal app in a static host (no node.js server will be running). I have been looking all over and can't find any info that can point me in the right direction.

How can this be achieved?

Thanks

In constant.js both values are already set to true and therefore server side rendering should work.
However if I disable JS nothing gets rendered, and if I enable JS the screen is blank until the browser has finished loading the JS. Both behaviour suggest that server-side is not working.
I did npm install, npm run buildand then npm start however this is my error.log:

2016-05-11 21:59 +01:00: DEPRECATION WARNING: `renderToStringWithPreboot` is no longer supported and will be removed in next release.
2016-05-11 21:59 +01:00: DEPRECATION WARNING: `renderToString` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToStringWithPreboot` is no longer supported and will be removed in next release.
DEPRECATION WARNING: `renderToString` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToStringWithPreboot` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToString` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToStringWithPreboot` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToString` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToStringWithPreboot` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToString` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToStringWithPreboot` is no longer supported and will be removed in next release.
2016-05-11 22:00 +01:00: DEPRECATION WARNING: `renderToString` is no longer supported and will be removed in next release.

This is npm run-script status:
Describing process with id 0 - name angular2-universal-starter
┌───────────────────┬──────────────────────────────────────────────────────────────────────┐
│ status │ online │
│ name │ angular2-universal-starter │
│ restarts │ 0 │
│ uptime │ 37s │
│ script path │ /Users/[.......] /tools/prod.js │
│ script args │ N/A │
│ error log path │ /Users/[.......] /logs/errors-0.log │
│ out log path │ /Users/[.......] /logs/output-0.log │
│ pid path │ /Users/[.......] /.pm2/pids/angular2-universal-starter-0.pid │
│ interpreter │ node │
│ interpreter args │ N/A │
│ script id │ 0 │
│ exec cwd │ /Users/[.......] │
│ exec mode │ fork_mode │
│ node.js version │ 5.10.1 │
│ watch & reload │ ✔ │
│ unstable restarts │ 0 │
│ created at │ 2016-05-11T20:59:27.106Z │
└───────────────────┴──────────────────────────────────────────────────────────────────────┘
Revision control metadata
┌──────────────────┬────────────────────────────────────────────────────────┐
│ revision control │ git │
│ remote url │ https://github.com/alexpods/angular2-universal-starter │
│ repository root │ /Users/[.......] │
│ last update │ 2016-05-11T20:59:57.000Z │
│ revision │ 813a512 │
│ comment │ Changed google chrome url │
│ branch │ master │
└──────────────────┴────────────────────────────────────────────────────────┘
Code metrics value
┌────────────┬────────┐
│ Loop delay │ 1.01ms │
└────────────┴────────┘
Add your own code metrics: http://bit.ly/code-metrics
Use pm2 logs angular2-universal-starter (--lines 1000) to display logs
Use pm2 monit to monitor CPU and Memory usage angular2-universal-starter

Hello there!
I was trying to configure express to use cache, but with not success. As angular2-universal is renderized on server, I believe it is always processing, for instance, /Home before delivering it to the browser.

Is there any way to configure cache? I'm sure I can deliver the first page of my website to the browser in just few miliseconds.

consider merging with offical universal-starter

I would love a dev mode that watches files and reloads browser automatically. Ideally this dev mode should not do bundling.

Steps to reproduce

1). run npm run dev
2). make error in the source-code

What is happening

After running npm run dev and making the error in the source code the watchers stop.

Expected behaviour

Watchers continue to watch for errors and try to build the projects after every change.

Log:

  angular2-universal-starter  npm run dev

> [email protected] dev /Users/Julia/Work/angular2/angular2-universal-starter
> node tools/dev.js

ts-loader: Using [email protected] and /Users/Julia/Work/angular2/angular2-universal-starter/tsconfig.json
ts-loader: Using [email protected] and /Users/Julia/Work/angular2/angular2-universal-starter/tsconfig.json
ts-loader: Using [email protected] and /Users/Julia/Work/angular2/angular2-universal-starter/tsconfig.json
Hash: c1c43125aa3c80a4e4d508cc80c1ba06c0f19b105620da56d03235c52baa
Version: webpack 1.12.13
Child
    Hash: c1c43125aa3c80a4e4d5
    Version: webpack 1.12.13
    Time: 11822ms
        Asset    Size  Chunks             Chunk Names
    server.js  100 kB       0  [emitted]  server
       [0] multi server 28 bytes {0} [built]
        + 58 hidden modules
Child
    Hash: 08cc80c1ba06c0f19b10
    Version: webpack 1.12.13
    Time: 9949ms
        Asset     Size  Chunks             Chunk Names
    worker.js  1.69 MB       0  [emitted]  worker
       [0] multi worker 40 bytes {0} [built]
        + 188 hidden modules
Child
    Hash: 5620da56d03235c52baa
    Version: webpack 1.12.13
    Time: 12750ms
            Asset     Size  Chunks             Chunk Names
    worker_app.js  2.59 MB       0  [emitted]  worker_app
       [0] multi worker_app 28 bytes {0} [built]
        + 234 hidden modules
webpack: bundle is now VALID.
webpack: bundle is now INVALID.
undefined:1479
        return map[req] || (function() { throw new Error("Cannot find module '" + req + "'.") }());
                                         ^

Error: Cannot find module 'undefined'.
    at eval (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:1479:42)
    at webpackContextResolve (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:1479:90)
    at webpackContext (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:1476:30)
    at Object.eval (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:178:40)
    at __webpack_require__ (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:23:30)
    at Object.eval (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:104:14)
    at __webpack_require__ (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:23:30)
    at Object.eval (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:59:13)
    at __webpack_require__ (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:23:30)
    at Object.eval (eval at recompileApp (/Users/Julia/Work/angular2/angular2-universal-starter/tools/dev.js:62:3), <anonymous>:50:19)

npm ERR! Darwin 14.5.0
npm ERR! argv "/usr/local/Cellar/node/5.4.1_1/bin/node" "/usr/local/bin/npm" "run" "dev"
npm ERR! node v5.4.1
npm ERR! npm  v3.5.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] dev: `node tools/dev.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script 'node tools/dev.js'.
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 angular2-universal-starter package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node tools/dev.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs angular2-universal-starter
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls angular2-universal-starter
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/Julia/Work/angular2/angular2-universal-starter/npm-debug.log
➜  angular2-universal-starter

Hello!
Im trying to use highcharts via ng2-highcharts directives, but I stuck with error (npm run dev, NO_WW, NO_SS)

ERROR in ./~/ng2-highcharts/ng2-highcharts.ts
Module parse failed: ./node_modules/ng2-highcharts/ng2-highcharts.ts Line 1: Unexpected token
You may need an appropriate loader to handle this file type.
| import {Ng2Highcharts} from './src/directives/ng2-highcharts';
| export * from './src/directives/ng2-highcharts';
|

It works well in official ng2-highcharts sample.

So Im trying to use it like this:

import HighCharts from 'ng2-highcharts/ng2-highcharts';

@Component({
    directives: [HighCharts.directives],
    template: `<div [ng2-highstocks]="chartStock" class="graph"></div>`
})

What is wrong?

Thank you.

Hello.
I have an error when submitting form using Enter key and trying to route using form input, but if event happens from input[type="submit"].click(), its okay.
In some cases submit event doesn't fire at all.
And form submits works fine in not-worker mode.

Error is

TypeError: null is not an object (evaluating 'element.events')

Code sample:

import { Component } from 'angular2/core';
import { NgForm } from 'angular2/common';
import { Router } from 'angular2/router';

@Component({
    selector: 'test-form',
    directives: [NgForm],
    template: `<form (ngSubmit)="onSubmit()">
    <input [(ngModel)]="field" placeholder="Type here smth" />
    <input type="submit" value="go" />
</form>`
})

export class ListComponent {
    field: string = '';

    constructor(private _router: Router) {};

    onSubmit() {
        this._router.navigate( ['SomeRoute', { param: this.field }] );
    }
}

I turned my application to angular universal. It's great but I have a problem with developing mode. I need to see my editing result real-time. I need to restart my app on each atrl+s (save) like build --watch and nodmeon.

My server is Eexpressjs and I'm using the command "npm run build:ssr" after each edit. It takes lots of time!!
How can I do that?

Please use Webpack2 for this starter.

Does it and it means that there is no Universal Title service yet?

This code crashes while building server bundle.

import { Title } from 'angular2/platform/browser';

./node_modules/angular2/src/facade/browser.js:4
var win = window;
^
ReferenceError: window is not defined

build working in local.but i dont know . how to move production in iis server.they have create two folder inside of dist.

Run into this issue on trying out the repo

npm run dev

[email protected] dev C:\Users\PhucTran\test-ng2\angular2-universal-starter
node tools/dev.js

events.js:141
throw er; // Unhandled 'error' event
^

Error: listen EADDRINUSE 127.0.0.1:3000
at Object.exports._errnoException (util.js:870:11)
at exports._exceptionWithHostPort (util.js:893:20)
at Server._listen2 (net.js:1234:14)
at listen (net.js:1270:10)
at net.js:1379:9
at GetAddrInfoReqWrap.asyncCallback as callback
at GetAddrInfoReqWrap.onlookup as oncomplete

npm ERR! Windows_NT 6.3.9600
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Users\PhucTran\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js" "run" "dev"
npm ERR! node v4.4.3
npm ERR! npm v3.10.7
npm ERR! code ELIFECYCLE
npm ERR! [email protected] dev: node tools/dev.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script 'node tools/dev.js'.
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 angular2-universal-starter package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! node tools/dev.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs angular2-universal-starter
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls angular2-universal-starter
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\PhucTran\test-ng2\angular2-universal-starter\npm-debug.log