WakaChewbacca WakaChewbacca - 1 month ago 5x
AngularJS Question

Trouble with $routeProvider in page served by Express.js

I am trying to build my first Express.js/Angular application but am having trouble with

on the page being served by the Express.js application. Here is the

var express = require('express');
var PORT = process.env.PORT || 3000;
var app = express();
app.get('/', function (req, res) {
res.sendFile(__dirname + '/client/views/index.html');

app.listen(3000, function () {
console.log("I'm listening");

page renders and includes the following Angular code:

var app = angular.module('app', ['ngRoute']);

app.config(function ($routeProvider) {
.when('/main', {

Yet when navigating to
, nothing is injected into the

Any advice would be greatly appreciated.


Having encountered this issue before I found a solution by telling express to serve files statically.


This tells express to send files from the 'client' directory as-is. This is used for files such as images, CSS & client side JavaScript. When referencing a file statically, paths are relative to the specified static directory so /client/views/main.html would be /views/main.html.

You can view the documentation for the express static middle ware here.