1

I try to use angular2 with webpack i follow the steps from angular guide and when run my project there is no errors and the output is:

 70% 3/3 build modules http://localhost:8080/
webpack result is served from http://localhost:8080/
content is served from D:\angular-webpack
404s will fallback to /index.html
chunk    {0} app.js, app.css (app) 3.56 kB {2} [rendered]
chunk    {1} polyfills.js (polyfills) 467 kB [rendered]
chunk    {2} vendor.js (vendor) 2.34 MB {1} [rendered]
Child html-webpack-plugin for "index.html":
    chunk    {0} index.html 321 bytes [rendered]
Child extract-text-webpack-plugin:
    chunk    {0} extract-text-webpack-plugin-output-filename 1.96 kB [rendered]
webpack: bundle is now VALID.

but i don't know what after this how to use it to deploy my project in production? also the dist folder is allways empty

Improve this question

3 Answers 3

Reset to default
1

You are running webpack dev server command - npm start, to launch your app go to http://localhost:8080/ . To deploy your project in production you should run npm build , it will create dist folder and produce a production bundle of your application.

See "scripts": in package.json

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

yes this work to me, now i have dist folder then how to deploy it in apache ??
Simply just copy and past your dist folder in xampp\htdocs or wamp\www & run http:/localhost/dist
0

to deploy your project in production run ng build --prod in command line. by doing this files to dist folder will be added.

Hope this helps.

Improve this answer

3 Comments

I assumed you used angular-cli which also use webpack. if you don't use angular-cli it will give error on execute.
can you give me a guide to angular-cli
I would recommend to look at their github project page: github.com/angular/angular-cli
0

Your question is extremely broad to give you a definite answer to your problem, how ever this might help you and other users on Stackoverflow.

I highly recommend viewing this boilerplate repository (https://github.com/AngularClass/angular2-webpack-starter/) using webpack2 and updates with the latest version of angular2.

It may abit more complex than you would like it to be, but you can take alot of direction from this repo like:

  • How to run a decent development workflow ( hmr and webpack watch )
  • How to compile your code to production ( minified and available in a dist folder )
  • structured and working e2e testing and unit testing

This isn't an exact answer but I think this will help direct alot of users with any webpack related setup questions

Here's the repo: https://github.com/AngularClass/angular2-webpack-starter/

I've been following it from the start and is my GOTO resource to get direction for setup on any new projects I start.

Hope this helps somewhat!

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.