Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jun 26 20:36
    john-dent commented #88
  • Jun 26 20:35
    john-dent commented #88
  • Mar 19 22:58
    gmostert closed #244
  • Feb 08 06:53
    OliverWall commented #251
  • Dec 14 2018 08:06
    fadehelix commented #251
  • Dec 14 2018 05:03
    thematho commented #251
  • Dec 14 2018 05:01
    thematho commented #209
  • Dec 14 2018 04:59
    thematho commented #209
  • Dec 12 2018 21:57
    fadehelix synchronize #251
  • Nov 04 2018 23:35
    thematho synchronize #224
  • Oct 26 2018 16:00
    Stephanemw commented #248
  • Oct 26 2018 00:16
    thematho synchronize #224
  • Oct 16 2018 11:11
    caprica-Six commented #148
  • Oct 16 2018 11:11
    caprica-Six commented #148
  • Oct 16 2018 11:10
    caprica-Six commented #148
  • Oct 16 2018 11:08
    caprica-Six commented #148
  • Oct 16 2018 11:07
    caprica-Six commented #148
  • Oct 09 2018 00:35
    thematho commented #251
  • Sep 16 2018 13:27
    scriptrance commented #114
  • Sep 14 2018 23:22
    KiranChaudhariJM commented #114
Matias Fernandez Martinez
@thematho
@maks232 every time you install a npm package and you want to load it you need to import the module, or the main JS file or the CSS files
maks232
@maks232
thanks for the help! :)
Georgy Glezer
@stolenng
Hey guys, i have deployed NG-starter to my server but its loads really slow, any reasons why ?
Matias Fernandez Martinez
@thematho
@stolenng What you mean by slow?
Did you run Load time benchmarks? -> https://developers.google.com/web/tools/chrome-devtools/network-performance/
Are you talking about the initial rendering after the resources are loaded? -> https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/timeline-tool
Zeeshan Syed
@syedz
Is anyone else having issues with the dist version that is created using the gulp webpack command? I'll run http-server -p 8080 on the generated dist folder, but currently when I refresh any page other than the / page, I'm left with a 404 page not found. However when I navigate to the exact same page using a ui-sref link, it works just fine.
ekiyanov
@ekiyanov
hi.
is there anyone awake?
Matias Fernandez Martinez
@thematho
Hi @ekiyanov
Fyodor
@loenko
@syedz why don't you use default browser-sync? it works fine with html5Mode, http-server doesn't! google the issue, it's well described
Matias Fernandez Martinez
@thematho
@syedz use the default npm scripts that NG6-Starter provides npm startuses browser-sync
Zeeshan Syed
@syedz
@thematho @loenko Thanks for your input. Maybe I'm misunderstanding something, but I'm referring to the dist that gets generated. I've installed browser-sync globally, but when I run browser-sync start --server dist/I still get the same issue.
Fyodor
@loenko
@syedz as @thematho said, you should use default scripts from gulpfile, because they contain historyAPIfallback as a middleware for html5mode support. Without gulp it is not easy to implement such workaround for full-featured livereloading. I like this seed for such beautiful and convenient solutions.
Zeeshan Syed
@syedz
@loenko Agreed, but then how would one run the contents of a dist folder in a production environment?
I am currently using the scripts from the gulpfile to run in my development environment
Fyodor
@loenko
@syedz there are middleware for html5mode serving for different servers and platforms, search for it with specific request
Zeeshan Syed
@syedz
@loenko Thanks
Fyodor
@loenko
My ng6-starter app doesn't work in IE11 (and I'm required to support it). Had anybody met and fixed such issue? Clear console and only tab title and favicon are displayed.
Gadzhimari Kachaev
@gadzhimari
Hi
Is anybody here?
I'm stuck and don't know how to solve this issue. The starter great but nothing says about how to include fonts using font-face. I install file-loader in dependencies. Add this entry in webpack.config.js. But get error everytime
2017-10-29_23-01-23.png
2017-10-29_23-02-06.png
Gadzhimari Kachaev
@gadzhimari
I add relative path and get error shows in above screenshot
Matias Fernandez Martinez
@thematho
Hi @gadzhimari if you have your fonts locally on your project adding the @importon your CSS should be enought, example using Angular Material Icons:
On my CSS file:
@font-face { font-family: 'Material Icons'; font-style: normal; font-weight: 400; src: url(MaterialIcons-Regular.eot); /* For IE6-8 */ src: local('Material Icons'), local('MaterialIcons-Regular'), url(MaterialIcons-Regular.woff2) format('woff2'), url(MaterialIcons-Regular.woff) format('woff'), url(MaterialIcons-Regular.ttf) format('truetype'); }
(Those files are on the CSS file folder, I mean the path should be relative to the CSS import statement on the CSS)
My webpack config:
loaders: [ { test: /\.js$/, exclude: [/app\/lib/, /node_modules/], loader: 'ng-annotate!babel' }, { test: /\.html$/, loader: 'raw' }, { test: /\.(scss|sass)$/, loader: 'style!css!sass' }, { test: /\.css$/, loader: 'style!css' }, { test: /\.(eot|woff|woff2|gif|jpg|svg|png|ttf)([\?]?.*)$/, loader: "file-loader" } ]
Gadzhimari Kachaev
@gadzhimari
@thematho thank you for reply but still not helpful. Let me explain in detail. I have a folder called fonts and put it near with base style folder, which have file called _typography.scss
2017-10-30_09-02-40.png
In this file I import fonts from fonts folder
I tried to use couple of ways but none of this works
src: url('MaterialIcons-Regular.woff2) format(woff2),
        url('MaterialIcons-Regular.woff) format(woff)

src: url('./MaterialIcons-Regular.woff2) format(woff2),
        url('./MaterialIcons-Regular.woff) format(woff)

src: url('../MaterialIcons-Regular.woff2) format(woff2),
        url('../MaterialIcons-Regular.woff) format(woff)
Gadzhimari Kachaev
@gadzhimari
Here my project structure, where you can see that fonts folder on same level as style folder, there I import fonts
2017-10-30_09-05-11.png
Matias Fernandez Martinez
@thematho
@gadzhimari the relative path to the font should be relative to the font face statement. Change the path to:
'./fonts/Material-XXXXX.woff'
You are declaring the font face on the _base.scss file
Gadzhimari Kachaev
@gadzhimari
@thematho I solved this problem when I moved the fonts folder on same level as app.scss file, where I import all my partials scss. I don't why it so strange behaviour. If I declare on the _typography.scss my font-face rules, why should I write different path which not relative to the _typography.scss file.
Matias Fernandez Martinez
@thematho
Hi @gadzhimari I think I found the difference.
I have a vendors.jsfile in which I'm importing: ./some-vendor/some.scssusing JS
Inside that file, the SCSS is doing the font-face and is using the relative path to some.scss. The thing that is happening on your case is that the SASS compilation is being compiled to your app.scss path, that's why you need the relative path from app.scss in order to webpack found the files for load them.
@gadzhimari Makes sense?
Gadzhimari Kachaev
@gadzhimari
yeah
Pablo Emilio Sanchez Lopez
@pasalo92
Hi, I'm trying to get the boilerplate running after forking/cloning but I'm running into this issue
image.png
Pablo Emilio Sanchez Lopez
@pasalo92
hehe needed to do an npm cache clean before doing npm install
:D
Oscar Pabon
@oscarandrespabonestrella
hello, i have a doubt, how can i use images in my project?, i already try with this "test: /.(jpe?g|gif|png|svg|woff|ttf|wav|mp3)$/, loader: "file", in the webpack config, but is not working, thanks in advance
Belinskiy21
@Belinskiy21
Hello, is anyone deployed ng6 to Heroku? I stacked there, help please!
Matias Fernandez Martinez
@thematho
@Belinskiy21 what have you configured on your web.js file or your procfile?
Matias Fernandez Martinez
@thematho
@Belinskiy21 You should use npm scripts to build the project (by default ng6-starter uses this) check on https://devcenter.heroku.com/articles/node-best-practices#hook-things-up
Fyodor
@loenko
@oscarandrespabonestrella looks like my answer's too late but...))) I guess you can try test: /\.(jpe?g|gif|png|svg|woff|ttf|wav|mp3)$/, loader: "file-loader?name='[path][name].[ext]?[hash]'
Belinskiy21
@Belinskiy21
@thematho my Procfile contains : web: node --optimize_for_size --max_old_space_size=920 --gc_interval=100 server.js
package.json : "scripts": {
"postinstall": "gulp install && gulp webpack build",
"build": "gulp webpack",
"component": "gulp component",
"serve": "gulp serve",
"start": "gulp serve",
"test": "karma start",
"watch": "gulp serve",
"webpack": "gulp webpack"
techyboy
@techyboy
Hi Community, any one can help me regarding running dist on production
I am getting errors missing some libraries with dist/build
techyboy
@techyboy
so any one pls point me to right direction or any how to for setting up production environment for ng6 starter