Problème de chargement des modules avec webpack via le didacticiel es6

Je suis en train de suivre le tutoriel THIS pour essayer de faire fonctionner le chargement du module, mais je continue de rencontrer un problème où l'instruction import ne fonctionne pas. import Mortgage from './mortgage2'; - Erreur de syntaxe non interceptée: Entrée de jeton inattendue.Problème de chargement des modules avec webpack via le didacticiel es6

Je n'ai qu'un seul fichier js/main.js, de sorte que la question est probablement (est-il pas censé être compilé code?)

Je suis en cours d'exécution npm run webpack suivi par npm start.

Webpack Config:

var path = require('path'); 
var webpack = require('webpack'); 

module.exports = { 
    entry: './js/main.js', 
    output: { 
     path: path.resolve(__dirname, 'build'), 
     filename: 'main.bundle.js' 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.js$/, 
       loader: 'babel-loader', 
       query: { 
        presets: ['es2015'] 
       } 
      } 
     ] 
    }, 
    stats: { 
     colors: true 
    }, 
    devtool: 'source-map' 
};

package.json

{ 
    "name": "es6-tutorial", 
    "version": "1.0.0", 
    "description": "Start the tutorial [here](http://ccoenraets.github.io/es6-tutorial).", 
    "main": "index.js", 
    "scripts": { 
    "babel": "babel --presets es2015 js/main.js -o build/main.bundle.js", 
    "start": "http-server", 
    "webpack": "webpack" 
    }, 
    "repository": { 
    "type": "git", 
    "url": "git+https://github.com/ccoenraets/es6-tutorial.git" 
    }, 
    "author": "", 
    "license": "ISC", 
    "bugs": { 
    "url": "https://github.com/ccoenraets/es6-tutorial/issues" 
    }, 
    "homepage": "https://github.com/ccoenraets/es6-tutorial#readme", 
    "devDependencies": { 
    "babel-cli": "^6.24.0", 
    "babel-core": "^6.24.0", 
    "babel-loader": "^6.4.1", 
    "babel-preset-es2015": "^6.24.0", 
    "http-server": "^0.9.0", 
    "webpack": "^2.3.2" 
    }, 
    "dependencies": { 
    "babel-cli": "^6.24.0", 
    "babel-core": "^6.24.0", 
    "babel-loader": "^6.4.1", 
    "babel-preset-es2015": "^6.24.0", 
    "http-server": "^0.9.0", 
    "webpack": "^2.3.2" 
    } 
}

sortie de la console :

E:\es6-tutorial>npm run webpack 

> [email protected] webpack E:\es6-tutorial 
> webpack 

(node:22340) DeprecationWarning: loaderUtils.parseQuery() received a non-string 
value which can be problematic, see https://github.com/webpack/loader-utils/issu 
es/56 
parseQuery() will be replaced with getOptions() in the next major version of loa 
der-utils. 
Hash: 8536c97add80f6d10d01 
Version: webpack 2.3.2 
Time: 980ms 
      Asset  Size Chunks    Chunk Names 
    main.bundle.js 6.64 kB  0 [emitted] main 
main.bundle.js.map 7.62 kB  0 [emitted] main 
    [0] ./js/mortgage2.js 2.23 kB {0} [built] 
    [1] ./js/main.js 1.64 kB {0} [built]

Notez le Les deux derniers fichiers n'apparaissent PAS dans les outils de développement chromés lorsque je charge localhost.

Source

2017-03-27 user1854458

Vous avez manqué une étape:

Ouvrir index.html dans votre éditeur de code, et modifier la balise comme suit pour charger construction/main.bundle.js, la version compilée de js/main.js:

Source

2017-03-27 19:55:09 user1854458

Problème de chargement des modules avec webpack via le didacticiel es6

Répondre

Questions connexes