webpack + babel loader исходная карта ссылки пустой файл

У меня есть проект es6, который я связываю с помощью webpack + babel loader. Когда я открываю devtools, я вижу «webpack: //» и все мои источники (es6) внизу.webpack + babel loader исходная карта ссылки пустой файл

Проблемы: контрольные точки не попали и ссылки на функции направляет меня к имени файла «d41d

, который имеет следующее содержание:

undefined 


/** WEBPACK FOOTER ** 
** 
**/

если я сверлить вниз из документа сценария ? функция в моей пачке я получаю к d41d файл, а

моего webpack.config.js:

module.exports = { 

    debug: true, 
    devtool: 'cheap-module-eval-source-map', 
    entry: "entry.js", 
    output: { 
     path: "C:/html5/", 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.js$/, 
       exclude: /(node_modules|bower_components)/, 
       loader: 'babel', 
       query: { 
        presets: ['es2015'], 
        plugins: ['transform-object-assign'], 
        sourceMaps: ['inline'] 
       } 
      } 
     ] 
    } 
};

и часть package.json в случае, это может помочь:

"devDependencies": { 
    "ava": "^0.16.0", 
    "babel-core": "^6.14.0", 
    "babel-loader": "^6.2.5", 
    "babel-plugin-transform-object-assign": "^6.8.0", 
    "babel-preset-es2015": "^6.13.2", 
    "cheerio": "^0.22.0", 
    "chokidar-cli": "^1.2.0", 
    "eslint": "^3.3.1", 
    "html-to-js": "0.0.1", 
    "jsdoc": "^3.4.0", 
    "jsdom": "^9.4.2", 
    "minami": "^1.1.1", 
    "obfuscator": "^0.5.4", 
    "sinon": "^1.17.5", 
    "uglify-js": "^2.7.3", 
    "webpack": "^1.13.2", 
    "yargs": "^5.0.0" 
    }, 
    "dependencies": { 
    "jquery": "^3.1.0" 
    }

Спасибо заранее.

источник

2016-08-29 Gal Ziv

Babel представила другой формат исходной карты here, и Webpack не справился с этим.
Исправление было объединено в this PR, а выпущено в Webpack 1.14.0.

источник

2016-12-07 12:55:16

работает как очарование. также для redux .. :) –

Это также только начал со мной происходит сегодня,

Я не уверен, что корень проблемы, но переключение devtool от cheap-module-eval-source-map к sourceMap устранила проблему на некоторое время.

источник

2016-08-30 22:01:56

Я использовал все возможные варианты devtools, упомянутые на веб-сайте. все закончилось тем же выходом –

Я уверен, что вы подумали об этом, но убедитесь, что после каждого изменения перезагрузите ваш devserver (или запущенный веб-пакет), так как работающий сервер не забирает изменения в конфигурацию webpack. –

Я не использую devserver. Я запускаю его вручную каждый раз. Но спасибо за головы –

Довольно поздно в эту тему. Но подумал, что это поможет будущим читателям. Я просто практикую комбинацию ES6 + Babel + Webpack и наткнулся на это видео, которое объясняет настройку среды разработки для ES6/ES2015 с помощью Babel и Webpack.

https://www.youtube.com/watch?v=wy3Pou3Vo04

я пытался точно так, как упомянуто в этом видео и работал для меня без проблем. В случае, если кто-то возникают проблемы с исходным кодом/видео:

Package.json

 
{ 
    ... 
    "devDependencies": { 
    "babel-core": "^6.14.0", 
    "babel-loader": "^6.2.5", 
    "babel-preset-es2015": "^6.14.0", 
    "webpack": "^1.13.2" 
    }, 
    "dependencies": { 
    "jquery": "^3.1.0" 
    } 
}

Message.js

 
export default class Message { 
    show(){ 
     alert("Hello world!"); 
    } 
}

app.js

 
import msg from './Message.js' 
import $ from 'jquery' 

$(function(){ 
    $("#ShowBtn").on("click", function(){ 
     var o = new msg(); 
     o.show(); 
    }); 
});

index.htm

<html> 
 
<head> 
 
\t <title></title> 
 
\t <script type="text/javascript" src="build/app.all.js"></script> 
 
</head> 
 
<body> 
 
\t <button id="ShowBtn">Show</button> 
 
</body> 
 
</html>

webpack.config.js

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

module.exports = { 
    devtool: 'source-map', 
    entry: ['./src/app.js'], 
    output: { 
     path: './build', 
     filename: 'app.all.js' 
    }, 
    module:{ 
     loaders:[{ 
      test: /\.js$/, 
      include: path.resolve(__dirname, "src"), 
      loader: 'babel-loader', 
      query:{ 
       presets: ['es2015'] 
      } 
     }] 
    }, 
    watch: true //optional 
};

только я добавил в приведенном выше исходного кода для соответствующих исходных карт одна вещь «devtool: 'source-map' 'в webpack.config.js (конечно, не упоминается в этом видео).

источник

2016-09-09 18:02:49 user203687

Не слишком поздно. Я оставил это на некоторое время, но плохо испытал это в воскресенье, когда вернусь к работе. Я обновляю результат. Благодаря! –

webpack + babel loader исходная карта ссылки пустой файл

ответ

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