title: Running angular from node.js server
body: <p>I have following files - </p>
  
  <p>1) index.html</p>
  
  <p>2) app.js (angular controllers here)</p>
  
  <p>3) routes.js (I'm trying to load index.html from here - listening on localhost :3000)</p>
  
  <p>4) index.css</p>
  
  <p>5) node_modules folder</p>
  
  <p><strong>routes.js :</strong> </p>
  
  <pre><code>var express = require('express'),
      app = express(),
      server = require('http').createServer(app),
      io = require('socket.io').listen(server);
  
  server.listen(3000);
  
  app.use("/node_modules", express.static('node_modules'));        
  app.use("/public", express.static('public'));
  
      app.get('/', function(req, res){
          res.sendFile(__dirname + '/index.html');
      });
  
  io.sockets.on('connection', function(socket){
      socket.on('send message', function(data){
          io.sockets.emit('new message', data);
      });
  });
  </code></pre>
  
  <p>When I open <strong>index.html</strong> file normally by clicking on it from file explorer, it opens fine as expected.</p>
  
  <p><a href="https://i.stack.imgur.com/MjN3O.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MjN3O.png" alt="enter image description here"></a></p>
  
  <p>But, when I run routes.js, to fetch the same <strong>index.html</strong> file, I get the raw HTML without angular effects. <strong>Why is this?</strong> </p>
  
  <p><a href="https://i.stack.imgur.com/0FX4i.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0FX4i.png" alt="enter image description here"></a></p>
  
  <p>Thanks!</p>
  
  <p><strong>EDIT :</strong> </p>
  
  <p>I can now access my index.css and app.js from <code>localhost:3000/public/</code>.
  I used <code>app.use("/public", express.static('public'));</code> in my <code>routes.js</code>.</p>
  
  <p>But now I can only get <code>css</code> included in my page, but still looks like angular is not included. I couldn't see the tabs. Please look at above screenshot of <code>index.html</code> file with tabs. </p>
  
  <p><strong>How can I include angular? Isn't it included from the HTML itself?</strong></p>
  
  <p><a href="https://i.stack.imgur.com/8JYXA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8JYXA.png" alt="enter image description here"></a></p>
  
  <p><strong>index.html -</strong> </p>
  
  <pre><code>&lt;html&gt;
  ...
  ...
  &lt;link href="node_modules/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet"&gt; 
  &lt;link href="public/index.css" rel="stylesheet"&gt; 
  
  &lt;body&gt;
  ...
  ...
  
  &lt;script src="node_modules/angular/angular.js"&gt;&lt;/script&gt;
  &lt;script src="public/ui-bootstrap-tpls-0.13.1.js"&gt;&lt;/script&gt;
  &lt;script src="node_modules/socket.io/node_modules/socket.io-client/socket.io.js"&gt;&lt;/script&gt;
  &lt;script src="public/app.js"&gt;&lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>EDIT :</strong> <strong>I solved it by including</strong> </p>
  
  <pre><code>app.use("/node_modules", express.static('node_modules'));
  </code></pre>
  
  <p>in my routes.js file. So now express also uses that folder, so <code>angular</code> files in that folder are used to serve my index.html file.
  Now, running my <code>localhost:3000/</code> gives me the expected result. Thanks!</p>