我很新玉,在我的node.js项目中,没有加载js和css外部文件。我使用玉为模板引擎,bower_component,angular.js如JavaScript MVC,引导的CSS框架和CLOUD9担任主编。我下面的代码给出:不加载js/css文件中的玉
我的项目结构::
-jobproject
|----node_modules
|-- bower
|-- express
|-- jade
|---public
|--- app
|-- app.js
|--- bower_components
|-- angular
|-- angular.js
|-- bootstrap
|-- dist/css/bootstrap.min.css
|-- jquery
|-bower.json
|-index.jade
|-package.json
|-README.md
|-server.js
在server.js文件::
var express = require("express");
var app = express();
app.set('views', __dirname);
app.set('view engine', 'jade'); // jade view engine
app.use(express.static(__dirname + '/public'));
app.get('*', function(req, res) {
res.render('index.jade');
});
app.listen(process.env.PORT, process.env.IP); // default cloud9 port
在index.jade ::
link(rel="stylesheet", href="bower_conponents/bootstrap/dist/css/bootstrap.min.css")
script(type='text/javascript', src='bower_conponents/angular/angular.js')
script(type='text/javascript', src='/app/app.js')
body(ng-app='app')
div(ng-controller='testCtrl')
div {{ test }}
span(class='btn btn-primary') hello world
在个app.js ::
angular.module('app', []);
angular.module('app').controller('testCtrl', function($scope) {
$scope.test = 'working';
})
在浏览器窗口:
{{ test }} <!-- should be "working"
hello world <!-- show be bootstrap button style, but only plain text -->
在控制台窗口:
angular.js:1 Uncaught SyntaxError: Unexpected token <
app.js:1 Uncaught ReferenceError: angular is not defined