在views文件夹中的angularjs index.html。

3

我有一点困惑。关于Nodejs的使用

附上文件夹结构图片。

如果我将index.html放在Client文件夹的根目录下,那么一切都正常工作。

另一方面,如果我将index.html移动到视图文件夹中,就像图片中所示,那么js文件无法加载,但index.html可以加载。

Nodejs - server.js

app.configure(function () {
    app.set('port', process.env.PORT || 3000);

    app.use(express.favicon());
    app.use(express.cookieParser());
    app.use(express.bodyParser());
    app.use(express.logger('dev'));  //tiny, short, default
    app.use(express.methodOverride());
    app.use(express.cookieSession({secret: "sdfr"}));

    //app.set('views', __dirname + '/client/views/');
    app.use(express.static(__dirname + '/client/views'));

});

app.js

app.config(['$routeProvider', function ($routeProvider) {

        $routeProvider.when('/',
            {
                templateUrl: 'partials/home.html',
                controller: 'HomeCtrl'
            });
        $routeProvider.when('/login',
            {
                templateUrl: 'partials/login.html',
                controller: 'LoginCtrl'
            });
        $routeProvider.when('/register',
            {
                templateUrl: 'partials/register.html',
                controller: 'RegisterCtrl'
            });

        $routeProvider.when('/404',
            {
                templateUrl: 'partials/404.html'
            });
        $routeProvider.otherwise({redirectTo: '/404'});

        //$locationProvider.html5Mode(true);

    }])

index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html ng-app="contactManager">
<head>
    <meta charset="utf-8">
    <title>Angular Demo</title>
</head>

<body>


<a href="#/">Home</a><br/>
<a href="#/login">Login</a><br/>
<a href="#/register">Register</a><br/>
<a href="#/private">Private</a><br/>
<a href="#/admin">Admin</a><br/>
<a href="#/404">404</a><br/>

<div>
    <div ng-view></div>
</div>

<script src="../lib/vendor/angularjs/1.1.5/angular.min.js"></script>

<script src="../js/app.js"></script>
<script src="../js/controllers.js"></script>

</body>

Folder Structure

Error


你为什么要用app.use(express.static...)替换掉app.set('views'..) - 在app.js中的被注释掉的代码? - callmekatootie
@callmekatootie,那段代码在server.js文件中。我正在检查,但是app.set('views'..)没有任何作用,我仍然无法加载应用程序。 - Pirzada
1个回答

3
目前你没有在express.static中包含JS。 在你的index.html文件中包含的位于../js的JS源文件因为express.static只服务于client/views目录,所以无处可去。
你应该将整个客户端包含在静态文件中,否则你将不得不将每个目录都包含到静态文件提供程序中。 app.use(express.static(__dirname + '/client/views'));表示您正在从/client/views中服务所有内容,但是没有服务该目录之外的任何内容。 app.use(express.static(__dirname + '/client/js'));将允许您服务JS文件夹,但它将在根目录下访问。 您可以使用两个静态提供程序,但第一个将在冲突事件中获胜。 您还可以执行app.use(express.static('/js', __dirname + '/client/js'));,这将允许您在yoursite.com/js上访问client/js,但我觉得这很奇怪。
阅读有关使用express.static的信息:http://expressjs.com/api.html#middleware

如果我使用app.use(express.static(path.join(__dirname,'client'))),即使如此,应用程序也无法工作,直到我将index.html放在Client文件夹的根目录下。而index.html在views文件夹中,我们必须告诉应用程序index.html的位置才能启动它。我是对的吗? - Pirzada
当你将index.html移动到根目录时,你是否更改了index.html文件中的路径?如果你将其保留在views中,则需要通过yoursite.com/views/index.html来访问它。如果您想在views中保留index.html并使其位于根目录,则必须使用多个expess.statics并将views放在第一位。然后修改静态文件的路径。例如:app.use(express.static(__dirname + '/client/views')); app.use('js', express.static(__dirname + '/client/js')); app.use('lib', express.static(__dirname + '/client/lib')); 然后确保您的包含引用使用js而不是../js - Jonathan Rowny

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接