How to deploy angular app to production
Asked Answered
Y

5

9

I'm a little uncertain about some Angular 5 aspects. I've developed an app and don't know how to run it on production.

Currently I run my app using ng serve in NodeJS , but is it same in a production environment ?

thanks!

Yesseniayester answered 22/2, 2018 at 12:44 Comment(0)
M
5

ng serve

ng serve is for development purpose. Check docs.

When using ng serve the compiled output is served from memory, not from disk. This means that the application being served is not located on disk in the dist folder.

ng build

ng build --prod is for production purpose. Check docs.

ng build compiles the application into an output directory. The build artifacts will be stored in the dist/ directory, inside the root directory of your angular app.

Jus copy the dist folder to any server like IIS or Node Express and your angular app is up and running.

To deploy you app using IIS check this and using Node Express check this.

Matney answered 22/2, 2018 at 12:58 Comment(0)
J
2

Generally, I do not use Angular CLI's built in web server for production deployments.

With Angular CLI, you can create a production build using this command

ng build –prod 

That will create a dist folder, which you can upload to any web server of your choosing to deploy an application.

Jos answered 22/2, 2018 at 12:49 Comment(0)
O
2

First and foremost, you should build your app for production using

ng build --prod

You'll find a dist folder in your project folder. This is the Production-ready version of your app.

Now you'd require a server to deploy your app. Install this - https://www.npmjs.com/package/http-server and run using http-server dist/myProject (replace myProject with your project name)

Overboard answered 17/6, 2020 at 17:5 Comment(0)
D
2

Follow this instruction by using Angular CLI:

1- Build your project (for production mode)

ng build --prod

2- If you want to see your project in production mode before deploy it on the real server you can use lite-server to serve your project in a local machine.

  • First install lite-server

    npm i lite-server --save-dev
    
  • And then run your project on local server

    lite-server --baseDir="dist/your-project-name"
    
Diapositive answered 10/6, 2022 at 18:49 Comment(0)
M
1

ng build generate production files in outDir folder.

To know where it is, go to .angular-cli.json file and see apps > outDir property. For example:

"apps": [
{
  "root": "src",
  "outDir": "../../webapp/recorder",
  "assets": [
    "assets",
    "favicon.ico"
  ],

...

These files are only html, css and javascript and can be used on any web server

Muttra answered 22/2, 2018 at 12:50 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.