When running the gulp command in Laravel 5.3, the following error occurs:
D:\wnmp\www\laravel-5-3-demo>gulp
(node:12992) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
[02:47:21] Using gulpfile D:\wnmp\www\laravel-5-3-demo\gulpfile.js
[02:47:21] Starting 'all'...
[02:47:21] Starting 'sass'...
[02:47:21] Finished 'sass' after 375 ms
[02:47:21] Starting 'webpack'...
{ [Error: ./~/babel-loader!./~/vue-loader/lib/selector.js?type=script&index=0!./resources/assets/js/components/Example.vue
Module build failed: Error: Cannot remove "babel-plugin-transform-es2015-modules-commonjs" from the plugin list.
at Object.<anonymous> (D:\wnmp\www\laravel-5-3-demo\node_modules\babel-preset-es2015-webpack\index.js:35:11)
at Module._compile (module.js:541:32)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
at D:\wnmp\www\laravel-5-3-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:324:15
at Array.map (native)
@ ./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: Error: Cannot remove "babel-plugin-transform-es2015-modules-commonjs" from the plugin list.\n at Object.<anonymous> (D:\wnmp\www\laravel-5-3-demo\node_modules\babel-preset-es2015-webpack\index.js:35:11)\n at Module._compile (module.js:541:32)\n at Object.Module._extensions..js (module.js:550:10)\n at Module.load (module.js:458:32)\n at tryModuleLoad (module.js:417:12)\n at Function.Module._load (module.js:409:3)\n at Module.require (module.js:468:17)\n at require (internal/module.js:20:19)\n at D:\wnmp\www\laravel-5-3-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:324:15\n at Array.map (native)\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 ] } }
According to this post, https://github.com/gajus/babe...
There are two solutions:
1.
npm i -D -E babel-preset-es2015@6.9.0
2.
// .babelrc
{
"presets": [
["es2015", {"modules": false}]
]
}
I want to use the second method, but there are two questions:
1. Where should the .babelrc
file be placed?
2. Do I need to delete anything and then reinstall it?
The post says to manually delete the node_modules folder and then run npm i
Just annotate what the arrow points to and you can gulp