2016-09-18 4 views
1

私はここあたりの愚かな簡単なチャットアプリしようとしている:私は、私は別のファイルにindex.htmlファイルのうち、CSSやJSを分割したい考え出し除き、http://socket.io/get-started/chat/ノードファイルを持つクライアントファイルの場所?

すべて良いです。だから私はこのようになり、プロジェクトのフォルダを持っている:

/myProject 
    index.js 
    index.html 
    /node_modules 
    /express 
    /socket.io 

だからmyprojectにフォルダ内に、私はクライアントのフォルダを作成し、そこにapp.cssとapp.jsを置く:

/myProject 
    /client 
    app.css 
    app.js 

と切り替え私のhtml:

<link rel="stylesheet" href="/client/app.css" /> 
<script src="http://code.jquery.com/jquery-1.11.1.js"></script> 
<script src="/socket.io/socket.io.js"></script> 
<script src="/client/app.js"></script> 

は、しかし私は私のクロムの検査官は/clientファイルに404エラーを持っている、ノードサーバを再起動し、インデックスを実行します。

node_modulesフォルダにクライアントフォルダを移動しようとしましたが(これはhtmlがsocket.io refを取得する場所でなければならないと思っていますが)、それはしません。

ノードサーバーが起動するとき、どのローカルフォルダが提供されますか(ここではWindowsを使用します)、他のクライアントサイドファイルを追加するにはどうすればよいですか。私はパッケージの依存関係の中でこれらをすべてリストアップするはずがありませんか?急行(4.10.2)

取得エラーを使用して、以下の答えは、はいパー

、:

reference error: express is not defined

var app = require('express')(); 
var http = require('http').Server(app); 
var io = require('socket.io')(http); 

app.use(express.static(__dirname + '/public')); 

app.get('/', function(req, res) { 
    res.sendFile(__dirname + '/index.html'); 
}); 

io.on('connection', function(socket) { 
    console.log('user connected'); 
    socket.on('disconnect', function() { 
     console.log('user disconnected'); 
    }); 
    socket.on('chat message', function(msg) { 
     console.log('message: ' + msg); 
    }); 
}); 

http.listen(3000, function() { 
    console.log('listening on *.3000'); 
}); 

答えて

3

イムと仮定し、使用して急行。

だから、Expressで静的ファイルを提供するために、あなたはこの

https://expressjs.com/en/starter/static-files.html

app.use(express.static('client'));

は、この情報がお役に立てば幸いです必要があります。

+0

また、HTMLのURLを '/ app.css'と'/app.js'に変更する必要があります。 – robertklep

+0

すべてが同じディレクトリにあります。記事を読む。あなたのURLはちょうどhref = "app.css" –

+1

になります。 '/ client /'接頭辞をHTMLに保つために 'app.use( '/ client'、express.static( 'client'))'を使うこともできます。 – robertklep

関連する問題