An Angular 2 Webpack Starter kit featuring Angular 2, Router, TypeScript, and Webpack by AngularClass
<label class="fileContainer dragAndDropHolder" >
{{dragDrop}}
<input type="file" id="attachKickBrowseSim" [class.disabled]="isFingersLocked" (change)="changeListener($event)" />
</label>
/* On Change */
changeListener($event) : void {
this.swimming($event.target);
}
/*Encode File*/
swimming(inputValue: any): void {
var foul = this;
var file:File = inputValue.files[0];
var myReader:FileReader = new FileReader();
myReader.onloadend = (e) => {
this.encodeBase64 = myReader.result;
foul.fileSelect=$("#attachKickBrowseSim").val().replace(/^.*\\/, "");
if(foul.fileSelect==''){
foul.dragDrop = foul.clearSim;
}else{
foul.dragDrop= "";
foul.dragDrop= foul.fileSelect;
}
}
$('.addMouseKickForm').show();
if(inputValue.files.length>0)
{
myReader.readAsDataURL(file);
}
}
setup: function(app) {
// For example, to define custom handlers for some paths:
new ThirdPartyRoute(app, null);
}
npm start
(builds and hosts) and we serve our production (AOT) build with a custom node server. We want to standardize the process and always serve the app from the same server (preferably the server that hosts the dev build when npm start
is ran). How could we do this?
src/main/webapp/app/features/bernie/bernie.module.ts
atsrc/main/webapp/app/bernie/bernie.module.ts
atERROR in ./compiled/src/main/webapp/app/app.module.ngfactory.ts
Module build failed: Error: Can't resolve './bernie/bernie.module' in '/Users/Dan/work/a/gba/src/main/webapp/app'
at onError (/Users/Dan/work/a/gba/node_modules/enhanced-resolve/lib/Resolver.js:61:15)
at loggingCallbackWrapper (/Users/Dan/work/a/gba/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at runAfter (/Users/Dan/work/a/gba/node_modules/enhanced-resolve/lib/Resolver.js:158:4)
...
tslint
complains on this code, saying that Don’t use ‘Function’ as a type. Avoid using the Function
type. Prefer a specific function type, like () => void
. Is there anyway of formatting this in a way that tslint
accepts? The suggestion () => void
does not really work out.interface AsyncRoutes {
[component: string]: Es6PromiseLoader |
Function |
FactoryEs6PromiseLoader |
FactoryPromise ;
}
Uncaught TypeError: jit_val_0 is not a function
at eval (ng:///AppModule/module.ngfactory.js:3)
at evalExpression (vendor.dll.js:71552)
at jitStatements (vendor.dll.js:71564)
at JitCompiler._compileModule (vendor.dll.js:71845)
at vendor.dll.js:71784
at Object.then (vendor.dll.js:46693)
at JitCompiler._compileModuleAndComponents (vendor.dll.js:71782)
at JitCompiler.compileModuleAsync (vendor.dll.js:71711)
at PlatformRef_._bootstrapModuleWithZone (vendor.dll.js:6388)
at PlatformRef_.bootstrapModule (vendor.dll.js:6374)
at HTMLDocument.main (main.bundle.js:7650)
at ZoneDelegate.invokeTask (polyfills.dll.js:4522)
at Zone.runTask (polyfills.dll.js:4289)
at ZoneTask.invokeTask [as invoke] (polyfills.dll.js:4596)
at invokeTask (polyfills.dll.js:5462)
at HTMLDocument.globalZoneAwareCallback (polyfills.dll.js:5488)
npm run build:aot:prod
Error: Error encountered resolving symbol values statically. Reference to a local (non-exported) symbol 'routes'. Consider exporting the symbol (position 19:7 in the original .ts file), resolving symbol HomeRoutingModule in /var/www/html/ng2-lab/prowebcli/src/app/modules/home/home-routing.module.ts
Hello All
I have a issue in AOT with tree shaking
Scenerio 1:
When I build by application with AOT, and then running the dist folder using http-server, the application opens in the browser and works fine, No issues here :grinning:.
Scenerio 2:
But when I add tree shaking
code in my file : webpack.config.js
along with AOT build
new HtmlWebpackPlugin({ title: 'Tree-shaking' })
reference : http://jakewiesler.com/tree-shaking-es6-modules-in-webpack-2/
and on running the AOT build folder, the browser displays error in the console like ERROR Error: The selector "app" did not match any elements
leaving with blank screen
Now If I remove that tree-shaking
code from web-pack and run the AOT build then the Application again works properly
Not Sure, what else is missing.
please have a look at my issue, and help me if you have any idea
npm run build:aot:prod
angular 4 starter kit with webpack
and a lot of features (https://github.com/AngularClass/angular-starter), which files/folder I can delete for starting new project. Thanks.
var proxies = require("../proxy.config.json");
var proxy_url = proxies.base_api_url;
...
devServer: {
proxy: {
'/api_request': {
target: proxy_url,
secure: false
}
}
},