js-code-to-svg-flowchart icon indicating copy to clipboard operation
js-code-to-svg-flowchart copied to clipboard

Webpack build/dev errors

Open Berkmann18 opened this issue 7 years ago • 1 comments

Not sure if it's to do with the deprecation that webpack had (which changes how build/dev processes work) or to do with babel (which if I recall correctly recommend using the babel-plugin-env instead of babel-plugin-es2015 since Babel v7). I'm trying to run npm run build and npm run dev which respectively outputs:


> [email protected] build /mnt/c/Users/max/Projects/js-code-to-svg-flowchart
> webpack --env build

Hash: 32fe82ee19a139c705de
Version: webpack 4.22.0
Time: 276ms
Built at: 2018-10-23 10:50:06
              Asset      Size  Chunks             Chunk Names
    js2flowchart.js  7.01 KiB    main  [emitted]  main
js2flowchart.js.map  4.11 KiB    main  [emitted]  main
Entrypoint main = js2flowchart.js js2flowchart.js.map
[./index.js] 2.84 KiB {main} [built] [failed] [1 error]

ERROR in ./index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module 'babel-core'
    at Function.Module._resolveFilename (module.js:548:15)
    at Function.Module._load (module.js:475:25)
    at Module.require (module.js:597:17)
    at require (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:3:13)
    at Module._compile (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/v8-compile-cache/v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at loadLoader (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/loader-runner/lib/loadLoader.js:13:17)
    at iteratePitchingLoaders (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
    at runLoaders (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
    at NormalModule.doBuild (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModule.js:265:3)
    at NormalModule.build (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModule.js:412:15)
    at Compilation.buildModule (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/Compilation.js:626:10)
    at moduleFactory.create (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/Compilation.js:1012:12)
    at factory (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:405:6)
    at hooks.afterResolve.callAsync (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:155:13)
    at AsyncSeriesWaterfallHook.eval [as callAsync] (eval at create (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:6:1)
    at AsyncSeriesWaterfallHook.lazyCompileHook (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/tapable/lib/Hook.js:154:20)
    at resolver (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:138:29)
    at process.nextTick (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:342:9)
    at _combinedTickCallback (internal/process/next_tick.js:132:7)
    at process._tickCallback (internal/process/next_tick.js:181:9)

> [email protected] dev /mnt/c/Users/max/Projects/js-code-to-svg-flowchart
> webpack --progress --colors --watch --env dev


webpack is watching the files…

Hash: 32fe82ee19a139c705de
Version: webpack 4.22.0
Time: 353ms
Built at: 2018-10-23 10:48:56
              Asset      Size  Chunks             Chunk Names
    js2flowchart.js  7.01 KiB    main  [emitted]  main
js2flowchart.js.map  4.11 KiB    main  [emitted]  main
Entrypoint main = js2flowchart.js js2flowchart.js.map
[./index.js] 2.84 KiB {main} [built] [failed] [1 error]

ERROR in ./index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module 'babel-core'
    at Function.Module._resolveFilename (module.js:548:15)
    at Function.Module._load (module.js:475:25)
    at Module.require (module.js:597:17)
    at require (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:3:13)
    at Module._compile (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/v8-compile-cache/v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at loadLoader (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/loader-runner/lib/loadLoader.js:13:17)
    at iteratePitchingLoaders (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
    at runLoaders (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
    at NormalModule.doBuild (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModule.js:265:3)
    at NormalModule.build (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModule.js:412:15)
    at Compilation.buildModule (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/Compilation.js:626:10)
    at moduleFactory.create (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/Compilation.js:1012:12)
    at factory (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:405:6)
    at hooks.afterResolve.callAsync (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:155:13)
    at AsyncSeriesWaterfallHook.eval [as callAsync] (eval at create (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:6:1)
    at AsyncSeriesWaterfallHook.lazyCompileHook (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/tapable/lib/Hook.js:154:20)
    at resolver (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:138:29)
    at process.nextTick (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/webpack/lib/NormalModuleFactory.js:342:9)
    at _combinedTickCallback (internal/process/next_tick.js:132:7)
    at process._tickCallback (internal/process/next_tick.js:181:9)

EDIT: After looking at the module list (npm ls --depth=0), I noticed this:

 UNMET PEER DEPENDENCY babel-core@6 || 7 || ^7.0.0-alpha || ^7.0.0-beta || ^7.0.0-rc
UNMET PEER DEPENDENCY [email protected] 

npm ERR! peer dep missing: webpack@2, required by [email protected]
npm ERR! peer dep missing: babel-core@6 || 7 || ^7.0.0-alpha || ^7.0.0-beta || ^7.0.0-rc, required by [email protected]   

Berkmann18 avatar Oct 23 '18 10:10 Berkmann18

After updating some dependencies, I now get this for npm run build:


> [email protected] build /mnt/c/Users/max/Projects/js-code-to-svg-flowchart
> webpack --env build

Hash: bd042d0ddd3f96ddbf63
Version: webpack 4.22.0
Time: 5290ms
Built at: 2018-10-23 11:41:43
              Asset      Size  Chunks             Chunk Names
    js2flowchart.js   6.8 KiB    main  [emitted]  main
js2flowchart.js.map  4.11 KiB    main  [emitted]  main
Entrypoint main = js2flowchart.js js2flowchart.js.map
[./index.js] 2.64 KiB {main} [built] [failed] [1 error]

ERROR in ./index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In /mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-preset-es2015/lib/index.js
    at createDescriptor (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:178:11)
    at items.map (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:109:29)
    at createPresetDescriptors (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:101:10)
    at presets (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:47:19)
    at mergeChainOpts (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-chain.js:315:26)
    at /mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-chain.js:278:7
    at buildRootChain (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-chain.js:118:22)
    at loadPrivatePartialConfig (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/partial.js:85:55)
    at Object.loadPartialConfig (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/partial.js:110:18)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:140:26)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:3:103)
    at _next (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:5:194)
    at /mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:5:364
    at new Promise (<anonymous>)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:5:97)
    at Object._loader (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:220:18)
    at Object.loader (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:56:18)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:51:12)

Which makes me think that index.js should be changed accordingly.

Here's what npm run dev gives:


> [email protected] dev /mnt/c/Users/max/Projects/js-code-to-svg-flowchart
> webpack --progress --colors --watch --env dev


webpack is watching the files…

Hash: bd042d0ddd3f96ddbf63
Version: webpack 4.22.0
Time: 5186ms
Built at: 2018-10-23 11:43:13
              Asset      Size  Chunks             Chunk Names
    js2flowchart.js   6.8 KiB    main  [emitted]  main
js2flowchart.js.map  4.11 KiB    main  [emitted]  main
Entrypoint main = js2flowchart.js js2flowchart.js.map
[./index.js] 2.64 KiB {main} [built] [failed] [1 error]

ERROR in ./index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In /mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-preset-es2015/lib/index.js
    at createDescriptor (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:178:11)
    at items.map (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:109:29)
    at createPresetDescriptors (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:101:10)
    at presets (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-descriptors.js:47:19)
    at mergeChainOpts (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-chain.js:315:26)
    at /mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-chain.js:278:7
    at buildRootChain (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/config-chain.js:118:22)
    at loadPrivatePartialConfig (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/partial.js:85:55)
    at Object.loadPartialConfig (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/@babel/core/lib/config/partial.js:110:18)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:140:26)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:3:103)
    at _next (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:5:194)
    at /mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:5:364
    at new Promise (<anonymous>)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:5:97)
    at Object._loader (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:220:18)
    at Object.loader (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:56:18)
    at Object.<anonymous> (/mnt/c/Users/max/Projects/js-code-to-svg-flowchart/node_modules/babel-loader/lib/index.js:51:12)

Berkmann18 avatar Oct 23 '18 11:10 Berkmann18