2017-03-19 1 views
1

Meine Anwendung läuft in Entwicklung, aber jedes Mal, wenn ich es zur Produktion bereitstelle, wird mir der Fehler bereitgestellt: "Uncaught SyntaxError: Unexpected token <". Wann immer ich die Quelle des Fehlers inspiziere, liegt es daran, dass das Webpack-Paket index.html statt des erwarteten javascript /assets/js/index.js lädt.Webpack: "Uncaught SyntaxError: Unerwartetes Token <" in Django

Ich folgere, dass dies ist Webpack ignoriert jede Anfrage außerhalb von index.html, aber nirgendwo in irgendwelchen Konfigurationen habe ich es als Standard darauf zeigen. Ich würde gerne wissen, wie ich dieses Problem beheben kann und es so rendern lasse, was als Einstiegspunkt konfiguriert ist.

Traceback:

Uncaught SyntaxError: Unexpected token < 

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <!--<title></title>--> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <script type="text/javascript" src="/static/jquery/dist/jquery.js"></script> 
    <script type="text/javascript" src="/static/materialize-css/dist/js/materialize.min.js"></script> 
    </head> 
    <body> 
     <div id="container"></div> 
     <script type="text/javascript" src="/static/assets/bundles/main-210eb139915d8d6abedf.js" ></script> 
    </body> 

webpack.config.js

//require our dependencies 
var path = require('path') 
var webpack = require('webpack') 
var BundleTracker = require('webpack-bundle-tracker') 

module.exports = { 
    //the base directory (absolute path) for resolving the entry option 
    context: __dirname, 
    //the entry point we created earlier. Note that './' means 
    //your current directory. You don't have to specify the extension now, 
    //because you will specify extensions later in the `resolve` section 
    entry: [ 
     './assets/js/index' 
    ],  
    output: { 
     path: path.resolve('./assets/bundles/'), 
     filename: "[name]-[hash].js" 
    }, 

    plugins: [ 
     //tells webpack where to store data about your bundles. 
     new webpack.NoErrorsPlugin(), // don't reload if there is an error 
     new BundleTracker({filename: './webpack-stats.json'}), 
     //makes jQuery available in every module 
     new webpack.ProvidePlugin({ 
      jQuery: 'jquery', 
      'window.jQuery': 'jquery' 
     }) 
    ], 

    module: { 
    loaders: [ 
     // we pass the output from babel loader to react-hot loader 
     { 
     test: [/\.js$/, /\.es6$/, /\.jsx?$/], 
     exclude: /node_modules/, 
     loaders: ['babel'], 
     }, 
     { test: /\.css$/, loader: "style-loader!css-loader" } 
    ] 
    }, 

    resolve: { 
     //tells webpack where to look for modules 
     modulesDirectories: ['node_modules'], 
     //extensions that should be used to resolve modules 
     extensions: ['', '.js', '.jsx'] 
    } 
} 
+0

Bitte fügen Sie das komplette Traceback hinzu. –

+0

Ich aktualisierte es, um das index.html einzuschließen. Es gibt wirklich kein Traceback, da das Webpack nur 'Uncaught SyntaxError: Unexpected token' ausgibt. '' – MysteryManners

Antwort

2

Versuchen Sie direkten Zugriff auf die JS oder CSS Datei direkt auf Browser, wenn Sie sehen werden, ist ein 404-Fehler, dann sind Sie statische Dateien nicht korrekt behandeln. können Sie verwenden dj-static oder konfigurieren Haupt-HTTP-Server (Apache oder Nginx) behandeln static Dateianforderungen.

Was passiert hier ist, dass Webpack versucht, die JS-Dateien in JS-Umgebung zu laden, aber die URL-Anfrage führt zu einer HTML-Datei (wahrscheinlich eine 404-Fehler) verursacht JS-Syntaxfehler (XML/HTML).

+0

Die JS- und CSS-Dateien sind direkt über den Browser zugänglich. Soweit statische Dateien betroffen sind, kümmert sich das whitenoise.py Plugin darum, sie zu verwalten. – MysteryManners

+0

Überprüfen Sie die Netzwerk-Registerkarte, zu welcher URL die Anfragen gehen und wie lautet die Antwort? –

+0

Alle Pfade sind wie erwartet. 200 auf jeden. Mein Verdacht ist, dass Webpack die Datei, die ich als Einstiegspunkt angegeben habe, nicht finden kann und stattdessen auf index.html verweist. – MysteryManners

Verwandte Themen