Yocker
  1. Yocker
  3. Node JS e token imprevisto Webpack <
Intereting Posts
Qual è il contatore delle prestazioni corretto per ottenere l’utilizzo della CPU e della memoria di un processo? Come / quando usare ng-clic per chiamare un percorso? Come creare un profilo e ottenere prestazioni JavaScript Come creare un’attività (TPL) che esegue un thread STA? Come impostare un cookie per scadere in 1 ora in Javascript? URL hash-bang (#! /) Prefisso invece di semplice hash (# /) in Angular 1.6 C – Errore di segmentazione con strcmp? Kafka: scrivere serializzatore personalizzato Ionic 2 Form si alza quando la tastiera mostra Django rest framework, usa diversi serializzatori nello stesso ModelViewSet Perché const implica il collegamento interno in C ++, quando non lo fa in C? È un bug di Matlab? Hai lo stesso problema? Che cosa significa “DAMP non SECCO” quando si parla di test unitari? Come rendere un’applicazione .NET “sensibile agli indirizzi”? Come utilizzare una libreria esterna non dattiloscritta da typescript senza .d.ts?

Node JS e token imprevisto Webpack <

Ho iniziato a studiare Node JS .

Quindi ecco i miei file.

index.html 

     
 
Hello

app.js 

 var http = require("http"), path = require('path') fs = require("fs"), colors = require('colors'), port = 3000; var Server = http.createServer(function(request, response) { var filename = path.join(__dirname, 'index.html'); fs.readFile(filename, function(err, file) { if(err) { response.writeHead(500, {"Content-Type": "text/plain"}); response.write(err + "\n"); response.end(); return; } response.writeHead(200); response.write(file); response.end(); }); }); Server.listen(port, function() { console.log(('Server is running on http://localhost:'+ port + '...').cyan);

webpack.config.js 

 module.exports = { entry: './src/index.js', output: { path: __dirname + '/assets', filename: 'bundle.js' } }

AGGIORNA bundle.js 

 /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ // Flag the module as loaded /******/ module.loaded = true; /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ function(module, exports) { alert('Hello'); /***/ } /******/ ]);

Quindi, quando raggiungo un app.js e visito l’indirizzo (localhost: 3000) ottengo l’errore nella console.

bundle.js: 1 Uncaught SyntaxError: Token imprevisto <

Anche il mio file JS non funziona. Qualcuno potrebbe suggerire qualcosa per risolverlo?

Grazie in anticipo

Il tuo server: 

 var Server = http.createServer(function(request, response) { var filename = path.join(__dirname, 'index.html');

… è configurato per ignorare tutto nella richiesta e restituire sempre il contenuto di index.html .

Quindi quando il browser richiede /assets/bundle.js viene dato index.html (ed errori perché non è JavaScript).

È necessario prestare attenzione al percorso e pubblicare contenuti appropriati, con il tipo di contenuto appropriato.

Probabilmente sarebbe meglio farlo trovando un modulo di file serving statico (Google diventa nodo-statico ) per Nodo (o sostituendo il nodo con qualcosa come Lighttpd o Apache HTTPD).

Se desideri pubblicare contenuti dinamici e contenuti statici, Express è una scelta popolare (e supporta i file statici ).

Indipendentemente da quanto richiesto dal browser, il server restituirà sempre lo stesso file esatto: index.html .

L’errore che stai vedendo è perché il tuo file HTML ha un riferimento a bundle.js , che, quando richiesto, viene restituito con il contenuto di index.html .

Dovresti utilizzare un framework web in modo da non doverti preoccupare di queste cose. Es. Espresso

Utenti Express:

Consenti al server Node di conoscere la posizione dei tuoi file statici

Nota questa linea >> app.use(express.static('public')) 

 //server.js const express = require('express') const app = express() // serve static assets from the public folder in project root app.use(express.static('public')) // app.listen(8080, () => console.log('listening...'))

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

In bocca al lupo.

È necessario servire tutti i tipi di file statici, ad esempio https://github.com/expressjs/serve-static#serv-files-with-vanilla-nodejs-http-server 

 var finalhandler = require('finalhandler') var http = require('http') var serveStatic = require('serve-static') // Serve up public/ftp folder var serve = serveStatic(__dirname) // Create server var server = http.createServer(function(req, res){ var done = finalhandler(req, res) serve(req, res, done) }) // Listen server.listen(process.ENV.port || 3000)