2015-11-01 6 views
0

Я впервые играю с модулями ES6, пытаясь получить базовое связывание с Webpack. Я бы хотел использовать Babel 6 (в настоящее время самый последний и самый лучший) для пересылки в загрузчик Webpack. Я читал this и this и this.Ошибка пути в Grunt/Webpack/Babel

package.json включает в себя: структура

"devDependencies": { 
    "babel": "~6.0.12", 
    "babel-core": "~6.0.12", 
    "babel-loader": "~6.0.0", 
    "babel-preset-es2015": "^6.0.14", 
    "grunt": "~0.4.5", 
    "grunt-webpack": "^1.0.11", 
    "webpack": "^1.12.2", 
    "webpack-dev-server": "^1.12.1" 
    }, 

файл:

myproject 
├── js 
│   ├── es6 
│   │   ├── app.js 
│   │   ├── lib 
│   │   │   ├── lib1.js 
│   │   │   ├── lib2.js 
│   │   └── modules 
│   │    └── _myModule.js 
├── node_modules 
├── index.html 
├── gruntfile.js 

gruntfile.js

module.exports = function(grunt) { 
    grunt.initConfig({ 
     pkg: grunt.file.readJSON('package.json'), 

     webpack: { 
      options: { 
       entry: "./js/es6/app.js", 
       output: { 
        path: __dirname, 
        filename: "webpacked.js", 
       }, 
       module : { 
        loaders: [ 
         { 

     // grunt --verbose says the problem is with the next line 
          include: path.resolve(__dirname, "es6"), 
          loader: 'babel',  
          query: { 
           presets: ['es2015'] 
          } 
         } 
        ] 
       }, 
       failOnError: true, 
       resolve: { 
        root: [ "js", "node_modules" ], 
       }  
      }, 
      build : { 
       devtool: "sourcemap", 
       debug: true 
      } 
     }, 

    }); 

    grunt.loadNpmTasks('babel'); 
    grunt.loadNpmTasks('babel-core'); 
    grunt.loadNpmTasks('babel-loader'); 
    grunt.loadNpmTasks('babel-preset-es2015'); 
    grunt.loadNpmTasks('grunt-minify-html'); 
    grunt.loadNpmTasks('grunt-webpack');  
    grunt.loadNpmTasks('grunt-sass'); 
    grunt.loadNpmTasks('grunt-contrib-watch'); 

    grunt.registerTask('default', ['webpack']); 
}; 

Я явно не хватает кое-что действительно основной с обработкой пути. Я даже не могу начать, и я часами ездил по кругу, пробуя множество комбинаций. Ошибка:

Loading "Gruntfile.js" tasks...ERROR 
>> ReferenceError: path is not defined 

Любая помощь очень ценится.

ответ

6

Вы делаете

include: path.resolve(__dirname, "es6"), 

и используя path модуль, но вы не загрузили его.

var path = require('path'); 
+0

:) Спасибо. Теперь я получаю сообщение об ошибке «Ошибка синтаксиса модуля: myproject/js/es6/app.js Строка 1: Неожиданный токен:« Импорт Fling из Fling.js »Для обработки этого типа файла вам может понадобиться соответствующий загрузчик». Похоже, что перегружаемый загрузчик Babel настроен только на работу с модулями, а не на код ES6 «импорт» в файле «entry» app.js. Как я могу переписать файл записи «app.js» в самом начале сборки, но при этом просто используя Webpack? – Ben

+0

'include' должен соответствовать любым ES6-файлам, поэтому, если у вас есть один вне вашей папки' es6', вам нужно будет расшифровать 'include', чтобы также соответствовать этому. – loganfsmyth

Смежные вопросы