Seed project for Angular Universal apps featuring Server-Side Rendering (SSR), Webpack, CLI scaffolding, dev/prod modes, AoT compilation, HMR, SCSS compilation, lazy loading, config, cache, i18n, SEO, and TSLint/codelyzer
Home Page: http://ng-seed.fulls1z3.com
License: MIT License
When try this example I show the page rendering twice on server side and rendering again on client side, Why this behavior occurs ?
Do you have any plans to do it for real time developing?
At the moment it takes too much time for compiling new bundles and serving in a browser.
I think all of us wants to see best performance in building and new nice features like HMR, etc. (what we see in @AngularClass/angular2-webpack-starter)
Because of this fact above it becomes useless example although you made great work!
Any plans to add AOT support to this demo app?
Thanks!
I'm submitting a ... (check one with "x")
[X ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
Unable to run any build commands on Windows. Errors out during gulp task 'bundle:spa-dev'
Expected/desired behavior
Expect a successful build.
Minimal reproduction of the problem with instructions
Please tell us about your environment:
Windows 10
mintty 2.0.3
node v6.10.3
npm v4.5.0
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ * ] support request => check the README and search github for a similar issue or PR before submitting
[ * ] feature request
Current behavior
Current we use cheap-module-source-map. When changed to an eval dev tool (like cheap-module-eval-source-map) or one of the 'development' devtools, get the error Error: HtmlWebpackPlugin: could not load file vendor.dll.js.map
Expected/desired behavior
It should work.
Minimal reproduction of the problem with instructions
change "DEV" devtool (in build-config.json) from cheap-module-source-map to cheap-module-eval-source-map and run the development build
What is the motivation / use case for changing the behavior?
To allow for better debugging
Please tell us about your environment:
VS code
Unfortunately I'm not an expert with webpack builds. If you can provide some guidance I can work on a pull-request.
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
It seems to be that recently an npm dependency has been updated which causes build issues for production build 'build:universal-prod'
Error: ./src/client/main-browser.ts
Module not found: Error: Can't resolve './app/app.browser.module.ngfactory' in 'C:\universal-master\src\client'
Expected/desired behavior
Prod Build should compile the production bundles
Minimal reproduction of the problem with instructions
Clone this repository locally
Run
npm install
npm run build:universal-prod
Please tell us about your environment:
Windows 10
I'm submitting a ...
[x] bug report => check the README and search github for a similar issue or PR before submitting
[x] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
adding <img src="assets/pic.jpg" /> to app.component.html (and a pic.jpg in the assets folder) gives the error: Can't resolve './assets/pic.jpg'
changing the path of the asset to relative, i.e making it <img src="../assets/pic.jpg" /> gives the error: Error: Path variable [chunkhash] not implemented in this context: assets/pic.[chunkhash].jpg. Assets should not be relative so adding the ../ shouldn't work in any case.
I run using: npm run build:universal-prod; npm run serve;
Expected/desired behavior
It should work. Or perhaps this is configured to work with different sort of paths? If so, please advice.
Please tell us about your environment:
Windows 10
Browser: all
**Quick Solution: ** changing chunkhash to hash in the webpack.common.js file seems to fix this error though I'm not sure what complications that might have. Although the path would need to be relative to the current location, and ideally we should just be able to do assets/pic.jpg or something of the sort.
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
When adding console.log('test') in the constructor of AppComponent file, the server is logging it 3 or 4 times.
Minimal reproduction of the problem with instructions
Hey,
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[x] feature request
What is the motivation / use case for changing the behavior?
I am creating a white label website on which the content shown is dependant from the url used by my users. I cannot use window.location as it is not available server side.
I would be pleased to help you implement this, but do you have any lead on how to do it ?
Thanks !!
PS: This topic seems interesting : http://stackoverflow.com/questions/43403649/how-to-get-full-base-url-including-server-port-and-protocol-in-angular-univer
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
I did not change anything in the code, just clone your version
When I try to run $npm run build:universal-dev
I have error:
21:12:36] Finished 'bundle:universal-browser-dev' after 21 s
[21:12:36] Starting 'bundle:universal-server-dev'...
Warning: ./node_modules/express/lib/view.js
79:29-41 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/webpack/lib/Compilation.js:694:24)
at Compilation.finish (/Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/webpack/lib/Compilation.js:552:9)
at applyPluginsParallel.err (/Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/webpack/lib/Compilation.js:498:11)
at processModuleDependencies.err (/Users/kkaabbaa/projects/johndeverall/test-universal/universal/node_modules/webpack/lib/Compilation.js:468:14)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickDomainCallback (internal/process/next_tick.js:128:9)
(1) warning(s) total.
Webpack: output server.0.chunk.js
Please tell us about your environment:
macOS Sierra
node --version = v6.11.1I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
I clone the repo and run the following command:
yarn install
npm run build:spa-dev
npm run serve:spa
and the app cannot run as there's no file named spa-server.js in /.server folder.
Expected/desired behavior
It supposes to run the SPA at http:\\localhost:1337.
Minimal reproduction of the problem with instructions
Just clone the repo and try to run the commands above.
The .server fold is empty after running the commands.
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
macOS Sierra 10.12.5, WebStorm 2017.1 , yarn v0.24.5
npm 3.10.10, node v6.11.0
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
Here's the output:
seed git:(master) ✗ npm run build:spa-dev
> @ng-seed/[email protected] build:spa-dev /Users/mikema/workspace/angular/seed
> gulp clean && gulp build:spa-dev
[16:05:08] Using gulpfile ~/workspace/angular/seed/gulpfile.js
[16:05:08] Starting 'clean'...
[16:05:08] Starting 'clean:public'...
[16:05:08] Finished 'clean:public' after 23 ms
[16:05:08] Starting 'clean:server'...
[16:05:08] Finished 'clean:server' after 5.09 ms
[16:05:08] Starting 'clean:cache'...
[16:05:08] Finished 'clean:cache' after 803 μs
[16:05:08] Starting 'clean:temp'...
[16:05:08] Finished 'clean:temp' after 852 μs
[16:05:08] Finished 'clean' after 33 ms
[16:05:09] Using gulpfile ~/workspace/angular/seed/gulpfile.js
[16:05:09] Starting 'build:spa-dev'...
[16:05:09] Starting 'dummy'...
[16:05:09] Finished 'dummy' after 652 μs
[16:05:09] Starting 'bundle:spa-dev'...
DLL: Checking if DLLs are valid.
DLL: Rebuilding...
DLL: Bundling done, all DLLs are valid.
[at-loader] Using [email protected] from typescript and "tsconfig.json" from /Users/mikema/workspace/angular/seed/tsconfig.json.
================================== ng-router-loader ==================================
Importer: /Users/mikema/workspace/angular/seed/src/client/app/app.routes.ts
Raw Request: ./+home/home.module#HomeModule
Replacement: function() { return new Promise(function (resolve) { require.ensure([], function (require) { resolve(require('/Users/mikema/workspace/angular/seed/src/client/app/+home/home.module')['HomeModule']); });})}
======================================================================================
================================== ng-router-loader ==================================
Importer: /Users/mikema/workspace/angular/seed/src/client/app/app.routes.ts
Raw Request: ./+about/about.module#AboutModule
Replacement: function() { return new Promise(function (resolve) { require.ensure([], function (require) { resolve(require('/Users/mikema/workspace/angular/seed/src/client/app/+about/about.module')['AboutModule']); });})}
======================================================================================
[at-loader] Checking started in a separate process...
[at-loader] Ok, 3.773 sec.
Webpack: output 0.chunk.js
Webpack: output 1.chunk.js
Webpack: output app.bundle.js
Webpack: output vendor.bundle.js
Webpack: output polyfills.bundle.js
Webpack: output app.style.css
Webpack: output 0.map
Webpack: output 1.map
Webpack: output app.map
Webpack: output vendor.map
Webpack: output polyfills.map
Webpack: output ./config.json
Webpack: output ./i18n/en.json
Webpack: output ./i18n/tr.json
Webpack: output vendor.dll.js
Webpack: output vendor.dll.js.map
Webpack: output polyfills.dll.js
Webpack: output polyfills.dll.js.map
Webpack: output index.html
Webpack: finished
[16:05:30] Finished 'bundle:spa-dev' after 21 s
[16:05:30] Starting 'copy:index.html'...
[16:05:30] public/index.html
[16:05:30] 1 item
[16:05:30] Finished 'copy:index.html' after 176 ms
[16:05:30] Starting 'clean:artifacts'...
[16:05:30] Finished 'clean:artifacts' after 6.68 ms
[16:05:30] Finished 'build:spa-dev' after 21 s
seed git:(master) ✗ npm run serve:spa
> @ng-seed/[email protected] serve:spa /Users/mikema/workspace/angular/seed
> nodemon ./.server/spa-server.js
Usage: nodemon [nodemon options] [script.js] [args]
See "nodemon --help" for more.
Thank you and feel free to ask any further question.
I'm submitting a ...
[x] support request
Has anybody managed to add https://github.com/ng-bootstrap/ng-bootstrap/?
I've followed the steps on their README but I'm getting the ng-X component is not a known element:
'ngb-rating' is not a known element
I tried adding a simple rating to the home component template:
https://github.com/ng-seed/universal/blob/master/src/client/app/+home/home.component.ts
Whole diff from current master (2caba6d):
diff --git a/src/client/app/+home/home.component.ts b/src/client/app/+home/home.component.ts
index 5283050..0775ccb 100644
--- a/src/client/app/+home/home.component.ts
+++ b/src/client/app/+home/home.component.ts
@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
@Component({
template: `ng-seed (universal) home page<br/>
- Enjoy it!<br/>`
+ <ngb-rating></ngb-rating>`
})
export class HomeComponent {
}
diff --git a/src/client/app/app.module.ts b/src/client/app/app.module.ts
index 62cb57e..d11a88f 100644
--- a/src/client/app/app.module.ts
+++ b/src/client/app/app.module.ts
@@ -19,6 +19,8 @@ import { MetaLoader, MetaModule, MetaStaticLoader } from '@ngx-meta/core';
import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
+import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+
// routes & components
import { routes } from './app.routes';
import { AppComponent } from './app.component';
@@ -88,7 +90,8 @@ export function translateFactory(platformId: any, http: Http): TranslateLoader {
useFactory: (translateFactory),
deps: [PLATFORM_ID, Http]
}
- })
+ }),
+ NgbModule.forRoot()
],If you can point me even in the right direction or what to google, that would be helpful
Hello guys,
I'm struggling to do something pretty simple : Grab the current hostname (domain name) and display it on a component. (I have multiple domain names pointing to the same application, so I need to get the hostname dynamically)
In a browser environment, I simply get it with document.location.hostname but since I'm using Universal, there is no such thing as document in a server environment.
So logically to achieve this, I will need to interact with nodejs request object and this is my question : Is there any way to inject the request and the response in Angular so I can get this kind of informations ?
I know it's possible with nguniversal/express-engine using Tokens (https://github.com/angular/universal/blob/master/modules/ng-express-engine/tokens.ts)
but I don't know if there is any way to achieve this with ngx-universal/express-engine
If anyone can help me with this please :)
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
npm run serve crashes on npm run build:universal-prod or build:universal-dev.
Expected/desired behavior
I think it should not crash by rebuilding server.js
Minimal reproduction of the problem with instructions
My steps (win10):
git clone https://github.com/ng-seed/universal.git
cd universal
npm install
npm run build:universal-prod
npm run serve
(new console) npm run build:universal-prod
Output:
D:\path\universal>npm run serve
> @ng-seed/[email protected] serve D:\path\universal
> npm run serve:universal
> @ng-seed/[email protected] serve:universal D:\path\universal
> nodemon ./.server/server.js
[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node ./.server/server.js`
Express server listening on http://localhost:8000
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] restarting due to changes...
[nodemon] starting `node ./.server/server.js`
module.js:472
throw err;
^
Error: Cannot find module 'D:\path\universal\.server\serv
er.js'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.runMain (module.js:605:10)
at run (bootstrap_node.js:423:7)
at startup (bootstrap_node.js:147:9)
at bootstrap_node.js:538:3
[nodemon] app crashed - waiting for file changes before starting...
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Win 2012R2, NodeJS 7, current repo
Angular version: 2.0.X
4.1 as in this repo.
Browser:
Console.
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[x] feature request
Current behavior
Expected/desired behavior
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
using a package like ngx-chips with scss files having @import gives an error unexpected character @ only when building in production mode
Expected/desired behavior
should work
Minimal reproduction of the problem with instructions
npm install ngx-chips -Shome.component.ts: <tag-input [(ngModel)]='tags'></tag-input>tags array to home.component.tsTagInputModule to home.module.ts from ngx-chipsprod mode with either npm run build:spa-prod or npm run build:universal-prodPlease tell us about your environment:
vs code, windows 10
node --version = 7.8.0Excerpt from a server response:
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Expected/desired behavior
I'm not sure how to run the universal server once I have built it with npm run build:universal-prod (I have deactivated UglifyJS as you told me in #11).
Minimal reproduction of the problem with instructions
I tried node .server/server.js but when I go to http://localhost:8000 it tells me that some .cache files are not existing.
node --version = 6.9.1Thanks for your help ! Again, when I know how, I will be submitting a PR to enhance the readme.
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
when i run the repo with server side not render http requests, the http call is to an api rest in another server.
Expected/desired behavior
i like to see the data render when i call the page
Minimal reproduction of the problem with instructions
it show me a empty array
Please tell us about your environment:
windows 10
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
6.10
[x] bug report
Current behavior
When run npm update I am getting
Vladislavs-MacBook-Pro:udoma personal$ npm upgrade
@ng-seed/[email protected] /Users/personal/code/udoma
├── UNMET PEER DEPENDENCY @ngx-cache/[email protected]
├── [email protected] (git://github.com/gulpjs/gulp.git#38246c3f8b6dbb8d4ef657183e92d90c8299e22f)
├── [email protected] (git://github.com/mishoo/UglifyJS2.git#278577f3cb75e72320564805ee91be63e5f9c806)
└── UNMET PEER DEPENDENCY [email protected]
npm WARN @ngtools/[email protected] requires a peer of webpack@^2.2.0 but none was installed.
npm WARN @ngx-cache/[email protected] requires a peer of @ngx-cache/[email protected] but none was installed.
npm WARN [email protected] requires a peer of webpack@^2.2.0 but none was installed.
Expected/desired behavior
Npm update successful
Minimal reproduction of the problem with instructions
npm updateWhat is the motivation / use case for changing the behavior?
So I can use the repo with the latest versions of node modules, install other node modules
Please tell us about your environment:
OSX
Node (for AoT issues): node --version = v6.10.3
Package.json:
"serve:universal": "nodemon ./.server/server.js",
but in ./.server/ there is only spa-server.js
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
I don't know why but sometimes running npm run serve:spa-hmr the files are still at the last occurence. When changing files nothing happens on http://localhost:1337.
I tried to remove .cache and .temp directories, with no success.
Any idea why ?
When I clone your repo again and then yarn, everything is working fine.
Minimal reproduction of the problem with instructions
I do not know how to reproduce :(
Please tell us about your environment:
Mac OS, VS Code, Yarn.
node --version = 6.9.1Thanks !
Switch to the official express engine @ng-universal/express-engine when it gets released (Angular 4.0).
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
After a fresh git clone / npm install, I run npm run build:universal-prod
I get this issue 4 times.
Then :
Expected/desired behavior
Build files ready for universal production server.
Minimal reproduction of the problem with instructions
npm run build:universal-prod
Please tell us about your environment:
Mac OS, yarn.
node --version = 6.9.1Thanks !
PS : it might be that I don't completely understand how to run production. If so, I can create a PR modifying the readme.
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
Everything work great! Untill I try to use any module written on C, I get error, while npm run build:universal-dev:
Error: ./node_modules/node-pre-gyp/lib/node-pre-gyp.js
Module not found: Error: Can't resolve '../package' in '/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/lib'
resolve '../package' in '/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/lib'
using description file: /mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.json (relative path: ./lib)
after using description file: /mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.json (relative path: ./lib)
using description file: /mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.json (relative path: ./package)
no extension
/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package doesn't exist
.ts
/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.ts doesn't exist
.js
/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.js doesn't exist
as directory
/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package doesn't exist
[/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package]
[/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.ts]
[/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.js]
[/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package]
@ ./node_modules/node-pre-gyp/lib/node-pre-gyp.js 62:16-37
@ ./node_modules/bcrypt/bcrypt.js
@ ./src/server/api/modules/users/models/users.model.ts
@ ./src/server/api/modules/users/models/index.ts
@ ./src/server/api/modules/users/index.ts
@ ./src/server/api/modules/index.ts
@ ./src/server/api/index.ts
@ ./src/server/server.ts
Error: ./node_modules/node-pre-gyp/lib/info.js
Module not found: Error: Can't resolve 'aws-sdk' in '/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/lib'
resolve 'aws-sdk' in '/mnt/c/projects/an-derjava/node_modules/node-pre-gyp/lib'
Parsed request is a module
using description file: /mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.json (relative path: ./lib)
after using description file: /mnt/c/projects/an-derjava/node_modules/node-pre-gyp/package.json (relative path: ./lib)
resolve as module
looking for modules in /mnt/c/projects/an-derjava/node_modules
using description file: /mnt/c/projects/an-derjava/package.json (relative path: ./node_modules)
after using description file: /mnt/c/projects/an-derjava/package.json (relative path: ./node_modules)
using description file: /mnt/c/projects/an-derjava/package.json (relative path: ./node_modules/aws-sdk)
no extension
/mnt/c/projects/an-derjava/node_modules/aws-sdk doesn't exist
.ts
/mnt/c/projects/an-derjava/node_modules/aws-sdk.ts doesn't exist
.js
/mnt/c/projects/an-derjava/node_modules/aws-sdk.js doesn't exist
as directory
/mnt/c/projects/an-derjava/node_modules/aws-sdk doesn't exist
looking for modules in /mnt/c/projects/an-derjava
using description file: /mnt/c/projects/an-derjava/package.json (relative path: .)
after using description file: /mnt/c/projects/an-derjava/package.json (relative path: .)
using description file: /mnt/c/projects/an-derjava/package.json (relative path: ./aws-sdk)
no extension
/mnt/c/projects/an-derjava/aws-sdk doesn't exist
.ts
/mnt/c/projects/an-derjava/aws-sdk.ts doesn't exist
.js
/mnt/c/projects/an-derjava/aws-sdk.js doesn't exist
as directory
/mnt/c/projects/an-derjava/aws-sdk doesn't exist
looking for modules in /mnt/c/projects/an-derjava
using description file: /mnt/c/projects/an-derjava/package.json (relative path: .)
after using description file: /mnt/c/projects/an-derjava/package.json (relative path: .)
using description file: /mnt/c/projects/an-derjava/package.json (relative path: ./aws-sdk)
no extension
/mnt/c/projects/an-derjava/aws-sdk doesn't exist
.ts
/mnt/c/projects/an-derjava/aws-sdk.ts doesn't exist
.js
/mnt/c/projects/an-derjava/aws-sdk.js doesn't exist
as directory
/mnt/c/projects/an-derjava/aws-sdk doesn't exist
[/mnt/c/projects/an-derjava/node_modules/aws-sdk]
[/mnt/c/projects/an-derjava/node_modules/aws-sdk.ts]
[/mnt/c/projects/an-derjava/node_modules/aws-sdk.js]
[/mnt/c/projects/an-derjava/node_modules/aws-sdk]
[/mnt/c/projects/an-derjava/aws-sdk]
[/mnt/c/projects/an-derjava/aws-sdk.ts]
[/mnt/c/projects/an-derjava/aws-sdk.js]
[/mnt/c/projects/an-derjava/aws-sdk]
[/mnt/c/projects/an-derjava/aws-sdk]
[/mnt/c/projects/an-derjava/aws-sdk.ts]
[/mnt/c/projects/an-derjava/aws-sdk.js]
[/mnt/c/projects/an-derjava/aws-sdk]
@ ./node_modules/node-pre-gyp/lib/info.js 14:14-32
@ ./node_modules/node-pre-gyp/lib ^\.\/.*$
@ ./node_modules/node-pre-gyp/lib/node-pre-gyp.js
@ ./node_modules/bcrypt/bcrypt.js
@ ./src/server/api/modules/users/models/users.model.ts
@ ./src/server/api/modules/users/models/index.ts
@ ./src/server/api/modules/users/index.ts
@ ./src/server/api/modules/index.ts
@ ./src/server/api/index.ts
@ ./src/server/server.ts
As far as I understand, it's necessary add that module as external to webpack.config, but I'm newer work with webpack and don't understand how to do this.
Minimal reproduction of the problem with instructions
Use 'sqlite3', 'pg', 'tedius', 'mysql2', 'mongoose'
What is the motivation / use case for changing the behavior?
Using DB store
Please tell us about your environment:
node v8.2.1
windows 10, debian, ubuntu on windows 10
latest ng-seed/universal
Angular version: 4.3.2
Browser: [all]
The sass files in assets/sass are not live reloaded when a changes occured.
I'll try to fix soon this when I have time available.
My PR might be in angular-webpack-config repo.
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Hi,
Is there any way to trigger a debug for the aot universal production build ? Cause I have this issue 'No provider for t' and I can't figure out why...
Thanks ;)
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request
Current behavior
The deps are all in alphabetical order.
Expected/desired behavior
They should be re-grouped again (see #41).
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
I would like to add this SSR to my project. I used ng2-admin as a base. How can i add this SSR to my project.. Please help
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
When adding keys to i18n files, changes are not taken into account. This works well on universal server (dev + prod) but not with spa.
Thanks !
Expected/desired behavior
Keys should be translated when using {{'KEY' | translate}} and not showing KEY.
Minimal reproduction of the problem with instructions
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
The dependency @nguniversal/express-engine does not support node.js v8.x.
Expected/desired behavior
It should support node.js platform v8.x.
Minimal reproduction of the problem with instructions
Running either npm install or yarn results with failure.
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
I'm submitting a ... (check one with "x")
[ x ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
When run "npm run build:universal-prod" the client package contains the @angular/compiler
Expected/desired behavior
The client package dont need the compiler on AOT compilations
Minimal reproduction of the problem with instructions
Use webpack bundle analyzer plugin to check client bundle
What is the motivation / use case for changing the behavior?
Remove more them 300kb on client blundle
Please tell us about your environment:
Fedor Linux
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[x ] feature request
Current behavior
This project does not have any (transient) state management solution.
Expected/desired behavior
ngrx v4.x could be introduced.
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
As well as being a seed project for Angular/SSR development, this project is also showcasing a bunch of angular libraries (ngx-...). Recently, I was asked about the compability of @ngx-config/core with ngrx v4.x (fulls1z3/ngx-config#18), and I think introducing ngrx to this project will both answer the compability issues as well as managing the state.
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
I'm submitting a ... (check one with "x")
[ X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
After cloning the repo, doing npm install, then build then serve, there is a style difference between the server rendered initial view and the client rendered view once it passes over.
Expected/desired behavior
views from server and client should use same styles
Minimal reproduction of the problem with instructions
clone repo, run the project as is, look at font changing on the initial load
What is the motivation / use case for changing the behavior?
Need consistent styles between browser and server
Please tell us about your environment:
VS Code, windows 10, node 6.9.1
Angular version: 2.0.X
All package versions unchanged from clone
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
All browsers
Language: [all | TypeScript X.X | ES6/7 | ES5]
all
Node (for AoT issues): node --version = 6.9.1
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
add svg to src/client/assets
example css background: url('../../assets/bg.svg') no-repeat center center;
webpack fails to build with error:
/home/<REDACTED>/Projects/<REDACTED>/node_modules/webpack/lib/TemplatedPathPlugin.js:69
.replace(REGEXP_CHUNKHASH, withHashLength(getReplacer(chunkHash), chunkHashWithLength))
^
Error: Path variable [chunkhash] not implemented in this context: assets/bg.[chunkhash].svg
Expected/desired behavior
For the svg to show as a background using relative paths to describe where it should be found.
Minimal reproduction of the problem with instructions
npm run build:spa-hmr
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Ubuntu 17.04, VsCode, NPM
Angular 4.10
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[x] feature request
Current behavior
The project has a very primitive UI.
Expected/desired behavior
Leveraging the power of @angular/material2 and @angular/flex-layout.
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Using @angular/material2 and @angular/flex-layout on a server-side-rendered Angular project and seeding it would save dozens of hours of development time of our community.
However, we need to wait until @angular/flex-layout beta.9 to be released, beta.8 fails on server-side rendering (angular/flex-layout#187).
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues): node --version =
Note: I didn't follow the template because this is not really a request or a report, but a discussion
I've found this kit awesome, very well coded, but it's too much complex, much more than a project generated using the Angular CLI for example. I know that the Universal come with other requirements, but this, for example, works fine, and it's much more easy to integrate with an existing project or start developing.
Some points for discussing:
ts-node?app.module, internationalization, and a lot of components? Couldn't it be a simple Hello World, maybe with two simple routes? How I'll know if I remove everything it will still work - what is mandatory and what is not?Having extra and useful features like PostCSS and Stylelint, for example, is good - if I need it. I know, I could exclude them, but how I will be sure that it would not break something? That's the reason that it should be optional. If I want it, I include it.
And don't get my wrong, it's just my own opinion. I've passed by the source code and I've seen the things that you've done - they're very well coded, and I know that it took a lot of effort to get done.
Hi, when I try install npm packages I get these errors:
npm ERR! notarget No compatible version found: @ngx-cache/[email protected]
npm ERR! notarget Valid install targets:
npm ERR! notarget 0.4.0-beta.1
In package.json file change some version and all packages installed.
"@ngx-cache/core": "0.4.0-beta.1",
"@ngx-cache/platform-browser": "0.4.0-beta.1",
"@ngx-cache/platform-server": "0.4.0-beta.1",
But when I try to start app with npm run serve I have new errors:
Error: Invalid provider for InjectionToken CACHE. useClass cannot be undefined.
Usually it happens when:
1. There's a circular dependency (might be caused by using index.ts (barrel) files).
2. Class was used before it was declared. Use forwardRef in this case.
at Error (native)
at syntaxError (C:\Projects2\universal-example-app\.server\server.js:81754:34) [<root>]
at CompileMetadataResolver._validateProvider (C:\Projects2\universal-example-app\.server\server.js:95116:31) [<root>]
at C:\Projects2\universal-example-app\.server\server.js:95073:27 [<root>]
at Array.forEach (native) [<root>]
at CompileMetadataResolver._getProvidersMetadata (C:\Projects2\universal-example-app\.server\server.js:95065:19) [<root>]
at C:\Projects2\universal-example-app\.server\server.js:94640:63 [<root>]
at Array.forEach (native) [<root>]
at CompileMetadataResolver.getNgModuleMetadata (C:\Projects2\universal-example-app\.server\server.js:94631:49) [<root>]
at JitCompiler._loadModules (C:\Projects2\universal-example-app\.server\server.js:105812:64) [<root>]
at JitCompiler._compileModuleAndComponents (C:\Projects2\universal-example-app\.server\server.js:105771:52) [<root>]
at JitCompiler.compileModuleAsync (C:\Projects2\universal-example-app\.server\server.js:105733:21) [<root>]
at PlatformRef_._bootstrapModuleWithZone (C:\Projects2\universal-example-app\.server\server.js:5508:25) [<root>]
at PlatformRef_.bootstrapModule (C:\Projects2\universal-example-app\.server\server.js:5494:21) [<root>]
Hey,
I would like to create a Pull Request to reorder the devDependencies (alphabetically) in your package.json.
The reason behind this is that yarn automatically do that and it creates huge conflict when git fetching your repo into my private one.
Do you agree ? If so, I will create a PR ASAP.
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
It seems to be that recently an npm dependency has been updated which causes silent build issues for production builds, both build:universal-prod and build:spa-prod . Previously everything has been working fine as for production builds but sometime in the last week these issues have arose.
Webpack itself gives no errors during the build but no css file is generated in the public folder.
The app will run but the css styles for the main app bundle do not show (lazy loaded modules still seem to display css for their components).
An error gets generated in the console
Uncaught Error: No NgModule metadata found for 't'.
at t.resolve (app.3be5665….bundle.js:1)
at t.getNgModuleMetadata (app.3be5665….bundle.js:1)
at t._loadModules (app.3be5665….bundle.js:1)
at t._compileModuleAndComponents (app.3be5665….bundle.js:1)
at t.compileModuleAsync (app.3be5665….bundle.js:1)
at e._bootstrapModuleWithZone (app.3be5665….bundle.js:1)
at e.bootstrapModule (app.3be5665….bundle.js:1)
at r (app.3be5665….bundle.js:1)
at r (app.3be5665….bundle.js:1)
at Object.163 (app.3be5665….bundle.js:1)
I attempted to trace this through but no luck as of yet. I will take more of a look at the production webkit builds over the next day or two and see if I can isolate the issue. In the mean time it would be great if anyone else could reproduce.
Expected/desired behavior
Prod Build should compile the production bundles including CSS with no errors.
Minimal reproduction of the problem with instructions
I have tried with existing projects using this repository as well as cloning a new repo from this one.
Clone this repository locally
Run
npm install
npm run build:universal-prod
npm run serve:universal
If you have an existing code base using this repository
rm -rf node_modules
npm cache clean
npm install
npm run build:universal-prod
npm run serve:universal
[x] bug report
[ ] support request
[ ] feature request
Current behavior
The page content is not updated regarding to the selected language (but the page title does)
Expected/desired behavior
The page content should be updated after language changed
Minimal reproduction of the problem with instructions
Not working on both living exemple and local
Thanks.
Hi guys!
How I can use primeNG modules with this template?
I installed to project and registered in module, but I have a error when I started like universal server.
VM32464:27 ERROR Error: Uncaught (in promise): Error: Unexpected value 'DropdownModule' imported by the module 'BlogModule'. Please add a @NgModule annotation. Error: Unexpected value 'DropdownModule' imported by the module 'BlogModule'. Please add a @NgModule annotation.
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
If background with an image is added to any sass file, source code breaks
Expected/desired behavior
Source code should be generated with background image assets
Minimal reproduction of the problem with instructions
Angular version: 4.1.3 (I am using Angular-webpack-config)
Browser: Chrome 59
I'm submitting a ... (check one with "x")
[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
Current behavior
Got this error when running server
Error: No ResourceLoader implementation has been provided. Can't read the url "../../assets/colors"
I have some sass files using @import
Expected/desired behavior
No error at all
Minimal reproduction of the problem with instructions
Just add a scss file and trying to import another scss file.
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Language: [all | TypeScript 2.3.2 | ES6/7 | ES5]
Node (for AoT issues): node --version = 7.6.0
Thank you and feel free to ask any further question.
I'm submitting a ... (check one with "x")
[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request
After importing auth0-js in a component I'm receiving the following error after building and serving via express. SPA mode works fine however.
Import:
import auth0 from 'auth0-js';
Run:
npm run build:universal-dev
npm run serve
Error:
/.server/server.js:134432
var crypto = require('crypto');
^
TypeError: require is not a function
Switch to the official Http Transfer State Module when it gets released (Angular 4.1+).
Nice example!
Is there any way to have something similar to this CacheService in Angular 4 ?
https://github.com/angular/universal-starter/blob/master/src/+app/shared/cache.service.ts .
https://github.com/angular/universal-starter/blob/master/src/node.module.ts
I am using this seed for server side rendering. Everything works perfectly.
Now, Issue occurs when any node_mode make a XMLHttpRequest. I have used https://github.com/backand/angular2-sdk this SDK in an application. This SDK makes an XMLHttpRequest to fetch data from the backend.
XMLHttpRequest object is available in the browser.
Hi All,
Do I have the ability to include other custom Headtags? For example, I need to make an a service call to a trusted service to get dynamic <script> tags to be inclued in the Head. It looks like the below code is more for config, but just wonder what I should look into to extend it. Appreciate any direction on that!
<% if (webpackConfig.htmlElements.headTags) { %>
<%= webpackConfig.htmlElements.headTags %>
<% } %>
Thanks
React
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
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
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.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.