PatrickJS on npm_and_yarn
PatrickJS on master
chore(deps-dev): bump node-sass… (compare)
dependabot[bot] on npm_and_yarn
chore(deps-dev): bump node-sass… (compare)
PatrickJS on master
Update README.md (compare)
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)
_base.scss
file
vendors.js
file in which I'm importing: ./some-vendor/some.scss
using JSfont-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.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.config
file 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';
@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 = { /*... */ };
@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);
}
}
[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