Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Sep 25 18:58

    PatrickJS on master

    Update README.md (compare)

  • Sep 24 19:59
    jimzshi closed #252
  • Sep 24 19:58
    jimzshi opened #252
  • 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
Gadzhimari Kachaev
@gadzhimari
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
Matias Fernandez Martinez
@thematho

Hi @techyboy, if you have problems adding libraries, you should do the following.
1 - Add the library to the package.json e.g.: "dependencies": { "angular-material": "^1.1.5" },
2 - in your app file add the import statement on your app.js file, e.g.: import ngMaterial from 'angular-material';
3 - If is an AngularJS Dependency, add the dependency on your main module e.g: angular.module('myApp, [ngMaterial]);

Note: Other libraries like jQuery might need to configuration on webpack.configfile using the ProvidePlugin.
If the library is not declared as a module, you will have to import the JS and CSS files manually:
e.g.:

import AngularMDDataTable from 'angular-material-data-table';
import 'angular-material-data-table/dist/md-data-table.css';
techyboy
@techyboy
yes thank you, mostly 404 errors were related to JS/CSS
btw what is best practices to run ng6 starter app on production server with pm2 daemonised approach with nginx reverse proxy? or any thing else?
Zeeshan Syed
@syedz
@thematho What's the syntax to check if running in a production environment. Wanted to configure my URLs correctly.
Matias Fernandez Martinez
@thematho
@syedz Do you mean to make sure that you deployed the correct build on the server, using the browser to check that?
Zeeshan Syed
@syedz
@thematho basically I want to check if the app is running on the production or staging environment. This will allow me to set my constant variables correctly ( base URLs being one of them). Sorry I should be more clear.
Matias Fernandez Martinez
@thematho

@syedz for what I know, there is no type of flag on the web app to distinguish between prod or staging, but you can create a script which is only added for production configuration with webpack and adds variables on the client that you need:
on webpack.config.js add app: [] as an entry:

module.exports = {
   devtool: 'source-map',
   entry: { app: [] },
   module: { /* ... */}
}

on gulpfile.bable.js replace:

gulp.task('webpack', ['clean'], (cb) => {
 const config = require('./webpack.dist.config');
 config.entry.app = paths.entry;

For:

gulp.task('webpack', ['clean'], (cb) => {
  const config = require('./webpack.dist.config');
  config.entry.app = paths.entry.concat(config.entry.app);

and Finally replace:

gulp.task('serve', () => {
  const config = require('./webpack.dev.config');
 config.entry.app = [
    'webpack-hot-middleware/client?reload=true',
  ].concat(paths.entry);

For:

gulp.task('browser-sync', () => {
  const config = require('./webpack.dev.config');
  config.entry.app = config.entry.app.concat([
      'webpack-hot-middleware/client?reload=true',
   ], paths.entry);

Now you can add the files on webpack.dist.config.js, overriding the entry.app to add this new file:

/* ... * / 
var config  = require('./webpack.config');
config.entry = {
  app: [
    path.join(__dirname, 'client/app/production.config.js')
  ]
};
config.output = {  /*... */ };
Zeeshan Syed
@syedz
@thematho Awesome thanks! Will give this a try :)
Elena Trudini
@elenat82
Hi everyone, has someone been able to generate documentation for their project? I found this https://github.com/nikhilmodak/gulp-ngdocs and followed the tutorial but nothing happened and I don't get any error.
Or maybe you can tell me about another npm mdule to use?
Thank you!
Elena Trudini
@elenat82
I made some progress, I think I managed to make it work, if anyone is interested I can provide more information
Matias Fernandez Martinez
@thematho
@elenat82 If you manage to do it you can send a pull request it would help a lot
Elena Trudini
@elenat82
Ok, I will!
Shahezad Chaudhari
@codershahezads90
Hello, I got the error in Angular 6 'Uncaught ReferenceError: process is not defined'
Matias Fernandez Martinez
@thematho
@codershahezads90 you are asking on the wrong Gitter, this is for AngularJS (v <2.0) and ES6
Shahezad Chaudhari
@codershahezads90
Ok sorry
Caio Oliveira
@caiodesign

Hello!! Does someone knows how to inject data into a component like props in React??

Ex.:
In Component Title:

// Title component
<h1 class="title>
    {this.props.children}
</h1>

In View:

<Title>Hello World!</Title>

Thanks!!!

Caio Oliveira
@caiodesign
Nevermind... I get it already! Thanks!
losorio35
@losorio35
losorio35
@losorio35

@Component({
selector: 'rep-menu-ventas-list',
template: `

<ng-content></ng-content>
<ng-container   [ngTemplateOutlet]="tplref"></ng-container>

`  

})

export class MenuVentasListComponent {

//@Input()tplref: TemplateRef<any>;
//@ContentChild(RelacionDocumentoComponent, {read: TemplateRef}) tplref;
//@ContentChild('filtroRelDoc') tplref: TemplateRef<any>;

@ViewChild(RelacionDocumentoComponent)private tplref: RelacionDocumentoComponent;

ngOnInit(){
console.log("RelDocTpl2",this.tplref);
}

}

Matias Fernandez Martinez
@thematho
@losorio35 Wrong chat, this is for AngularJS. Also no question was asked
Jerome
@web-jeromejose
hi
i have this error when i run the npm run test:e2e
[15:07:54] E/launcher - Process exited with error code 135
npm ERR! code ELIFECYCLE
npm ERR! errno 135
npm ERR! ng6-starter@0.0.1 test:e2e: `protractor protractor.conf.js`
npm ERR! Exit status 135
npm ERR!
npm ERR! Failed at the ng6-starter@0.0.1 test:e2e script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/jeromejose/.npm/_logs/2019-04-13T12_07_54_626Z-debug.log