Nodejs加载javascript和图像问题
我开始回到Nodejs并面临一些初始问题。
我正在尝试获取静态页面，java脚本和图像从不同的文件夹加载。使用基本的Nodejs，ejs。带有index.js的根文件夹被加载并显示我放在那里的文本。但是图像和java脚本没有被加载。
看起来我错过了一些非常基本的东西。这是我的index.js文件： 在具有此index.js的基本文件夹内，有一个views文件夹，该文件夹又包含一个pages文件夹。
var cool = require('cool-ascii-faces');
var express = require('express');
var app = express();
app.set('port', (process.env.PORT || 5000));
app.use(express.static(__dirname + '/public'));
// views is directory for all template files
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.get('/', function(request, response) {
response.render('pages/ind');
});
app.get('/cool', function(request, response){
response.send(cool());
});
app.listen(app.get('port'), function() {
console.log('Node app is running on port', app.get('port'));
});
ind.ejs
<!DOCTYPE html>
<!DOCTYPE html>
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en-US"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en-US"> <!--<![endif]-->
<head>
<!-- META DATA -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- Title -->
<title>WOTR - Coming Soon</title>
<!-- CSS Global Compulsory -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css" >
<!-- CSS Implementing Plugins -->
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="css/ionicons.min.css" />
<link rel="stylesheet" type="text/css" href="css/animate.min.css" />
<link rel="stylesheet" type="text/css" href="css/flexslider.css" />
<link rel="stylesheet" type="text/css" href="css/owl.carousel.css" />
<link rel="stylesheet" type="text/css" href="css/owl.theme.css" />
<link rel="stylesheet" type="text/css" href="css/vegas.min.css" />
<link rel="stylesheet" type="text/css" href="css/menu.css" />
<link rel="stylesheet" type="text/css" href="css/sidebar.css" />
<!-- Fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,700italic,400,300,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Raleway:400,300,700,900' rel='stylesheet' type='text/css'>
<!-- JS -->
<script type="text/javascript" src="js/modernizr.js"></script>
<script type="text/javascript" src="js/snap.svg-min.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://webnextbd.net/demo/js/respond.min.js"></script>
<![endif]-->
<!--[if lt IE 11]>
<link rel="stylesheet" type="text/css" href="http://webnextbd.net/demo/css/ie.css">
<![endif]-->
</head>
<body class="image-background">
<!-- Preloader -->
<div id="preloader">
<div id="loading-animation"> </div>
</div>
<!-- /Preloader -->
<!-- Overlay -->
<div id="section-home" class="home-section-wrap center">
<div class="section-overlay"></div>
</div>
<!-- /Overlay -->
<!-- container -->
<div class="containers"><!-- menu -->
<!--
<nav id="menu" class="menu">
<button class="menu__handle"><span>Menu</span></button>
<div class="menu__inner">
<ul>
<li><a href="index.html"><i class="fa fa-fw fa-home"></i><span>Home</span></a></li>
-->
<!--
<li><a href="about.html"><i class="fa fa-fw fa-info"></i><span>About</span></a></li>
<li><a href="team.html"><i class="fa fa-fw fa-users"></i><span>Team</span></a></li>
<li><a href="services.html"><i class="fa fa-fw fa-gear"></i><span>Services</span></a></li>
<li><a href="portfolio.html"><i class="fa fa-fw fa-camera"></i><span>Portfolio</span></a></li>
<li><a href="contact.html"><i class="fa fa-fw fa-envelope"></i><span>Contact</span></a></li>
</ul>
-->
</div>
<!--
<div class="morph-shape" data-morph-open="M300-10c0,0,295,164,295,410c0,232-295,410-295,410" data-morph-close="M300-10C300-10,5,154,5,400c0,232,295,410,295,410">
<svg width="100%" height="100%" viewBox="0 0 600 800" preserveAspectRatio="none">
<path fill="none" d="M300-10c0,0,0,164,0,410c0,232,0,410,0,410"/>
</svg>
</div>
-->
</nav><!-- /menu -->
<!-- main -->
<div class="main">
<!-- header -->
<header class="header-site">
<div class="logo-site animated bounceInDown" data-animation-delay="700">
<img class="img-responsive" src="wotrlogo.png" data-at2x="wotrlogo.png" alt="Logo" />
</div>
</header>
<!-- /header -->
<!-- section -->
<section class="section fullscreen site-main">
<div class="container-section">
<div class="container-table">
<div class="content-table">
<!-- bt-carousel -->
<div class="bt-carousel">
<!-- home section -->
<div class="item-slide show">
<!-- container -->
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<!-- content slide -->
<div class="content-slide">
<!-- Clock Countdown -->
<div id="clock-countdown" class="animated bounceInDown" data-animation-delay="700"></div>
<h3 class="color-white top-margin animated bounceInDown" data-animation-delay="700" >Our website is under construction. Check us out in a feww days.</h3>
<!-- Subscribe Form -->
<div class="form animated bounceInUp" data-animation-delay="700">
<!-- container form -->
<div class="container-form">
<!--
section page
<div class="section-page" id="signup">
<form class="subscription-form mailchimp" method="post" id="mc-form">
<input type="email" id="email" class="border-radius-22 bottom-margin" name="email" placeholder="You Email Address" />
<button type="submit" id="subscribebtn" class="border-button no-bottom-margin">Subscribe</button>
</form>
<p class="message-error"></p>
<p class="message-success"></p>
-->
</div><!-- /section page -->
</div><!-- /container form -->
</div><!-- /Subscribe Form -->
<!-- socials icons -->
<!--
<nav class="socials-icons animated bounceInUp" data-animation-delay="700">
<ul>
<li><a href="#"><i class="ion-social-facebook"></i></a></li>
<li><a href="#"><i class="ion-social-twitter"></i></a></li>
<li><a href="#"><i class="ion-social-googleplus"></i></a></li>
<li><a href="#"><i class="ion-social-linkedin"></i></a></li>
<li><a href="#"><i class="ion-social-pinterest"></i></a></li>
<li><a href="#"><i class="ion-social-dribbble-outline"></i></a></li>
</ul>
</nav> /socials icons
-->
<!-- copyright -->
<footer class="copy-right animated bounceInUp" data-animation-delay="700">
<div class="copyright">
© 2017 <a href="http://world.now ">World Now</a> - All Rights Reserved
</div>
</footer><!-- /copyright -->
</div><!-- /content slide -->
</div>
</div><!-- /row -->
</div><!-- /container -->
</div>
<!-- /home section -->
</div><!-- /bt-carousel -->
</div>
</div>
</div>
</section><!-- /section -->
</div><!-- /main -->
</div><!-- /container -->
<!-- JS -->
<script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="./js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/retina.min.js"></script>
<script type="text/javascript" src="js/jquery.backstretch.min.js"></script>
<script type="text/javascript" src="js/jquery.countdown.min.js"></script>
<script type="text/javascript" src="js/jquery.parallaxify.min.js"></script>
<script type="text/javascript" src="js/jquery.particleground.min.js"></script>
<script type="text/javascript" src="js/vegas.min.js"></script>
<script type="text/javascript" src="js/trianglify.min.js"></script>
<script type="text/javascript" src="js/jquery.mb.YTPlayer.js"></script>
<script type="text/javascript" src="js/jquery.nicescroll.min.js"></script>
<script type="text/javascript" src="js/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
<script type="text/javascript" src="js/jquery.appear.js"></script>
<script type="text/javascript" src="js/classie.js"></script>
<script type="text/javascript" src="js/sidebar.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>
知道我缺少什么吗？
谢谢，
1 个答案:
答案 0 :(得分：0)
您是否尝试过提供视图文件夹以及公用文件夹？
app.use(express.static(__dirname + '/public'));
app.use(express.static(__dirname + '/views'));
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？