JeffreyWay / laravel-elixir-vue

Laravel Elixir Vue integration.
40 stars 7 forks source link

Configure babel es2015 preset #6

Closed kasparasg closed 8 years ago

kasparasg commented 8 years ago

Hi @JeffreyWay,

I've been having the same issue as described in #3 and I have used master branch to try the potential fix that was merged from #4. It worked for the most part - all my .vue files compiled fine, but then none of my .js modules got loaded (can't find a better description for this issue).

Anyway, after some digging, looks like passing an option to disable module transformation does the trick. Perhaps this is valid fix?

cklmercer commented 8 years ago

Tested this is a fresh install of Laravel 5.3 (hoping it would solve a different problem I'm having), and it causes the following error.

[19:05:23] Starting 'webpack'...
{ [Error: ./~/babel-loader!./~/vue-loader/lib/selector.js?type=script&index=0!./resources/assets/js/components/Example.vue
Module build failed: ReferenceError: [BABEL] /home/cody/Code/pub-sub/resources/assets/js/components/Example.vue: Using removed Babel 5 option: foreign.modules - Use the corresponding module transform plugin in the `plugins` option. Check out http://babeljs.io/docs/plugins/#modules
    at Logger.error (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/logger.js:41:11)
    at OptionManager.mergeOptions (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:233:20)
    at /home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:289:14
    at /home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:342:20
    at Array.map (native)
    at OptionManager.resolvePresets (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:305:20)
    at OptionManager.mergePresets (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:288:10)
    at OptionManager.mergeOptions (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:14)
    at OptionManager.init (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:383:12)
    at File.initOptions (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/index.js:223:65)
 @ ./resources/assets/js/components/Example.vue 2:17-130
 @ ./resources/assets/js/app.js]
  message: './~/babel-loader!./~/vue-loader/lib/selector.js?type=script&index=0!./resources/assets/js/components/Example.vue\nModule build failed: ReferenceError: [BABEL] /home/cody/Code/pub-sub/resources/assets/js/components/Example.vue: Using removed Babel 5 option: foreign.modules - Use the corresponding module transform plugin in the `plugins` option. Check out http://babeljs.io/docs/plugins/#modules\n    at Logger.error (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/logger.js:41:11)\n    at OptionManager.mergeOptions (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:233:20)\n    at /home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:289:14\n    at /home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:342:20\n    at Array.map (native)\n    at OptionManager.resolvePresets (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:305:20)\n    at OptionManager.mergePresets (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:288:10)\n    at OptionManager.mergeOptions (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:14)\n    at OptionManager.init (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/options/option-manager.js:383:12)\n    at File.initOptions (/home/cody/Code/pub-sub/node_modules/babel-core/lib/transformation/file/index.js:223:65)\n @ ./resources/assets/js/components/Example.vue 2:17-130\n @ ./resources/assets/js/app.js',
  showStack: false,
  showProperties: true,
  plugin: 'webpack-stream',
  __safety: { toString: [Function: bound ] } }
kasparasg commented 8 years ago

@cklmercer hmm... that's something new. I haven't come across this one yet 😞

kasparasg commented 8 years ago

Hmm, I doubt this PR is relevant now after the latest changes @JeffreyWay has done.

kasparasg commented 8 years ago

Right, just to give more context as to why I closed it. Looks like I have misunderstood the ES6 module system. After following this article here it became clear what I had to do. Hope it helps others too.