2017-02-16 2 views
0

Ich versuche, ein bestimmtes Knotenmodul für meinen Client in meinem SPA Mean Stack-Anwendung zur Verfügung zu stellen. Meine app Struktur ist wie folgt:Serve ein node_module mit Express

-app/

--index.html

-node_modules/

-index.js

und ich möchte das Modul machen Winkel-simple-Sidebar verfügbar in meinem vorderen Ende durch das in meiner index.js Datei tun:

'use strict'; 
let express = require('express'); 
let routes = require('./api/routes'); 
let path = require('path'); 

app.use((req, res, next) => { 
    req.start = Date.now(); 
    next(); 
}); 

// ***** THIS IS THE PROBLEM LINE ***** 
app.use('/scripts', express.static(__dirname + '/node_modules/angular-simple-sidebar')); 


app.use(express.static(path.join(__dirname, './app'))); 
app.use(routes); 

app.get('/', (req, res) => { 
    res.sendFile('index.html', { 
    root: ('./app') 
    }); 
}); 

/* GET Api index page */ 
app.get('*', (req, res) => { 
    res.send('404 page not found!', 404); 
}); 

app.listen(3000,() => { 
    console.log('Express server is listening on port 3000'); 
}); 

module.exports = app; 

und dann diesen Weg in meine index.html Datei:

<head> 
<script src="scripts/angular-simple-sidebar.min.js"></script> 
</head> 

aber alles, was ich in meiner Chromkonsole erhalten, ist dies:

chrome console output

Jede Hilfe bei allen geschätzt werden würde!

Antwort

3

Ich habe das gleiche versucht, aber es funktioniert für mich.

Ich habe eine externe CSS-Datei geladen.

Hier ist mein Code


index.js

// Get the required modules 
const express = require('express'); 


let path = require('path'); 

const port = process.env.PORT || 8080; 

const host = 'localhost'; 

var app = express(); 


// For serving static assets 

app.use(express.static(path.join(__dirname, '/public'))); 

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

app.get('/', (req, res) => { 
    res.sendFile('index.html', { 
    root: (__dirname + '/public') 
    }); 
}); 

// Start Server 
app.listen(port, function(){ 
    console.log(`Server running on http://${host}:${port}`) 
}); 

public/index.html (In Ihrem Fall dieses ist app/index.html)

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title></title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link href="css/style.css" rel="stylesheet"> 
    </head> 
    <body> 
    <h1>Hello World</h1> 
    </body> 
</html> 

css/style.css

h1{ 
    color: red; 
} 

Versuchen Sie auch, die 'Skripte' Teil der statischen Dateien von der Bereitstellung und Lauf zu entfernen.


Index.js

// ***** THIS IS THE PROBLEM LINE ***** 
app.use(express.static(__dirname + '/node_modules/angular-simple-sidebar')); 

index.html

<head> 
<script src="angular-simple-sidebar.min.js"></script> 
</head> 

Wenn die oben ausgeführt fehlschlägt, dann einige weitere Details geben oder den Code durch Github teilen.

0

fügen Sie einfach einen führenden Schrägstrich

<head> 
<script src="/scripts/angular-simple-sidebar.min.js"></script> 
</head> 
0

Ich habe versucht gleiche Modul installieren und es funktioniert für mich mit Ihrem Code in Ordnung. Ich kann auf diese Dateien zugreifen .. Hier ist mein Code

'use strict'; 
const express = require('express'); 
const app = express(); 
app.use('/scripts', express.static(__dirname + '/node_modules/angular-simple-sidebar')); 
app.get('/' ,(req, res) => { 
    res.send("<script src='scripts/angular-simple-sidebar.min.js'/>"); 
}); 

Ich denke, es gibt einige anderen Probleme mit Ihrer Route .. können Sie mir den Code in app/Ordnern zur Verfügung stellen, wo die eigentliche app() Funktion ausgeführt wird und wenn in Fall dauert es mehr Zeit, um dies zu lösen .. Sie können die statischen Dateien von node_modules statische Ordner verschieben, wenn diese nur statischen Inhalt sind und sehen, ob es funktioniert