4

I have an angular 2 code with webpack and grunt. While in the development mode I use webpack-dev-server to load and i run this as a grunt task.

While building code for the production deployment, I do all the minification etc using Grunt and create a dist/ folder.

However how do i run this dist/ folder? What server to use?

I read that webpack-dev-server should not be used for production deployment. So i started looking for other options which which i can start a server as a grunt command.

I found that grunt:server should not be used. http://stackoverflow.com/questions/22577336/can-grunt-server-use-for-production-application-deployment

I then started to thing about express server but i am really not sure.

All I want is that the dist/ folder that I create should be rendered using a server.I am using webpack

My questions are :

  1. Should we not start the server as a Grunt task ? Should we use npm scripts instead?
  2. Which server should I use to deploy production grade code which uses webpack?
Bhumi Singhal
  • 8,063
  • 10
  • 50
  • 76

1 Answers1

0

My dist folder is found under wwwroot. It is referenced from the index.html file, also found under wwwroot. The original files are found under a ClientApp folder in my application.

WebPack minimises and deploys the files from my ClientApp folder and puts them in a main.js file under dist.

WebPack also does this for all the vendor files, which are actually stored in the node_modules folder in the root path of the project. It puts these in vendor.js.

It does the same with the css files. See my index.html file below. See the reference to the /dist/ folder?

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Home Page - MyApp</title>
  <base href="/" />
  <link rel="stylesheet" href="/dist/vendor.css" />
  <link rel="stylesheet" href="/dist/styles.css" />
</head>
<body >

    <my-app />

  <script src="/dist/vendor.js"></script>
  <script src="/dist/main.js"></script>

</body>
</html>
tone
  • 1,374
  • 20
  • 47