2015-06-15 6 views
7

Ho creato un progetto Node JS in Visual Studio (comunità professionale e 2013 2012) con NTVS e usato un generatore Yeoman per creare un Knockout SPA app (usando l'opzione dattiloscritto nella configurazione del generatore).Come posso eseguire il debug di un generatore Yeoman KO (con dattiloscritto e gulp) Nodo Progetto JS in Visual Studio con Node JS Tools per studio visivo

Ora ho bisogno di decidere quale file impostare come file di avvio durante il debug (premendo F5). Suppongo che questo sarebbe ./src/app/require.config.js perché altrimenti ottengo un errore che richiede è indefinito.

All'avvio del debug, tutto sembra a posto e viene visualizzata una finestra della console con il messaggio "Debugger sta ascoltando la porta 5858". Ma quando avvio localhost: 5858, non c'è server/sito web.

Posso avviare l'app su un server su un'altra porta, ma in questo caso non vengono colpiti punti di interruzione, nemmeno nel file di avvio.

Quindi le mie domande sono: - cosa devo impostare come file di avvio? - Come si esegue il debug della mia app in Visual Studio con NTVS?


Modifica

ho stabilito che quando aggiungo un nuovo NTVS progetto vuoto viene creato un file con server.js:

var http = require('http'); 
var port = process.env.port || 1337; 
http.createServer(function (req, res) { 
    res.writeHead(200, { 'Content-Type': 'text/plain' }); 
    res.end('Hello World\n'); 
}).listen(port); 

L'impostazione di questa come i risultati in file di avvio debugging funzionante per questo file.

Come posso caricare ancora require tramite require.config.js e avviare la mia app con startup.ts?

require.config.js

// require.js looks for the following global when initializing 
var require = { 
    baseUrl: ".", 
    paths: { 
     "bootstrap": "bower_modules/components-bootstrap/js/bootstrap.min", 
     "crossroads": "bower_modules/crossroads/dist/crossroads.min", 
     "hasher": "bower_modules/hasher/dist/js/hasher.min", 
     "jquery": "bower_modules/jquery/dist/jquery", 
     "knockout": "bower_modules/knockout/dist/knockout", 
     "knockout-projections": "bower_modules/knockout-projections/dist/knockout-projections", 
     "signals": "bower_modules/js-signals/dist/signals.min", 
     "text": "bower_modules/requirejs-text/text" 
    }, 
    shim: { 
     "bootstrap": { deps: ["jquery"] } 
    } 
}; 

startup.ts

import $ = require("jquery"); 
import ko = require("knockout"); 
import bootstrap = require("bootstrap"); 
import router = require("./router"); 

// Components can be packaged as AMD modules, such as the following: 
ko.components.register('nav-bar', { require: 'components/nav-bar/nav-bar' }); 
ko.components.register('home-page', { require: 'components/home-page/home' }); 

// ... or for template-only components, you can just point to a .html file directly: 
ko.components.register('about-page', { 
    template: { require: 'text!components/about-page/about.html' } 
}); 

ko.components.register('grid-page', { require: 'components/grid-page/grid-page' }); 

// [Scaffolded component registrations will be inserted here. To retain this feature, don't remove this comment.] 

// Start the application 
ko.applyBindings({ route: router.currentRoute }); 

Modifica 2

Con ulteriori indagini posso iniziare la mia app con un server.js file come file di avvio contenente

var http = require('http'); 
var app = require('./src/app/startup.js'); 
var port = process.env.port || 1337; 
http.createServer(app).listen(port); 

ma questo comporta l'errore "definizione non definita".

risposta

1

Ok, dopo un po 'di ricerca, penso che la cosa che stai cercando di fare sia sbagliata.

Si sta tentando di caricare jquery in un ambiente di nodo. Il nodo è un ambiente di esecuzione senza browser. Non c'è finestra Non c'è un documento. Commenta dalla parte superiore del file jquery:

// For CommonJS and CommonJS-like environments where a proper `window` 
    // is present, execute the factory and get jQuery. 
    // For environments that do not have a `window` with a `document` 
    // (such as Node.js), expose a factory as module.exports. 
    // This accentuates the need for the creation of a real `window`. 
    // e.g. var jQuery = require("jquery")(window); 
    // See ticket #14549 for more info. 

Credo che ciò che si vuole fare, invece è restituire un HTML dal server a un browser. Quell'html dovrebbe fare riferimento a jquery, bootstrap e knockout - i file javascript lato client che funzionano su documenti - tramite tag script.


Si noti inoltre: dal momento che il jquery e altri sono in esecuzione in un browser, non sarà possibile utilizzare Visual Studio per eseguire il debug di loro (per quanto posso dire). Dovresti invece usare gli strumenti del browser per esaminare il loro comportamento.

https://stackoverflow.com/a/21178111/8155

+0

Abbiamo provato il pacchetto amdefine e questo ha risolto l'errore 'define is undefined', ma ci ha dato l'errore 'jquery is undefined' dato che il file requirejs.config.js contiene quei percorsi e possiamo ' t sembrano caricare quelli –

+0

scusa, l'errore ricevuto è 'impossibile trovare il modulo' jquery '' –

+0

Vedo, ma quello che non capisco è il link che hai fornito. Che cosa ha a che fare con la nostra situazione (a parte la parte NodeJS) –

2

penso che si stia mescolando lo sviluppo di server e di sviluppo del browser. Un progetto nodejs è pensato per essere eseguito come un processo sulla tua macchina e potrebbe fungere da server web tra molte altre cose. L'app a eliminazione diretta SPA a cui si fa riferimento è pensata per funzionare in un ambiente browser. Solo il generatore di Yeoman e alcuni strumenti di te impostati come parte del processo di compilazione per il modello a eliminazione diretta (ad esempio gulp) necessitano di nodejs, ma questo è richiesto solo al momento della compilazione, non quando si esegue il proprio codice.

Quando si desidera eseguire il debug di javascript in un browser, è necessario individuare il file index.html principale e aprirlo in un browser: alcuni IDE dispongono di funzioni per aprire una pagina su un server integrato e eseguirne il debug direttamente (webstorm per esempio), altri potrebbero richiedere l'apertura della pagina in un browser e l'aggiunta di un debugger javascript. In Visual Studio probabilmente dovresti aprirlo in Internet Explorer e inserire un breakpoint nel codice js in VS, non sono sicuro se puoi anche aprire direttamente una pagina da VS e se devi regolare le impostazioni di IE (chiedi a google, conosce meglio di me)

Problemi correlati