Vuepress: execution issue after installation using yarn but not npm

[mapl]

after installing vuepress globally using yarn (yarn global add vuepress), I'll get an error when running "vupress dev"

ERROR in multi C:/Users/admin/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'buble-loader' in 'C:\dev\vuepress'
@ multi C:/Users/admin/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js

however using npm, the installation (npm install -g vuepress) and running "vupress dev" works fine

[ulivz]

I found Can't resolve 'buble-loader' in 'C:\dev\vuepress', Why there is an error targeting to C:\dev\vuepress when you just install it globally?

Can you provide the detailed description?

[davidbernegger]

Having the same Problem as @mapl and Ferry, log looks similar to Issue #103

`PS C:\Users\david\Desktop\vuepress> vuepress dev

VuePress dev server listening at http://localhost:8080/

× ｢wdm｣: Hash: f3b897efc179f7bf1b22
Version: webpack 4.5.0
Time: 12106ms
Built at: 2018-4-17 17:17:27
Asset Size Chunks Chunk Names
assets/js/app.js 28.8 KiB app [emitted] app
index.html 320 bytes [emitted]
Entrypoint app = assets/js/app.js
[0] multi C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js 28 bytes {app} [built]
[1] multi webpack-hot-client/client?fa2c92f8-3a93-4c15-ad89-08d75165ea0e C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js 40 bytes {app} [built]

ERROR in multi C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'buble-loader' in 'C:\Users\david\Desktop\vuepress'
@ multi C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js

ERROR in multi webpack-hot-client/client?fa2c92f8-3a93-4c15-ad89-08d75165ea0e C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'buble-loader' in 'C:\Users\david\Desktop\vuepress'
@ multi webpack-hot-client/client?fa2c92f8-3a93-4c15-ad89-08d75165ea0e C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js

ERROR in multi webpack-hot-client/client?fa2c92f8-3a93-4c15-ad89-08d75165ea0e C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'webpack-hot-client/client?fa2c92f8-3a93-4c15-ad89-08d75165ea0e' in 'C:\Users\david\Desktop\vuepress'
@ multi webpack-hot-client/client?fa2c92f8-3a93-4c15-ad89-08d75165ea0e C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/clientEntry.js
Child html-webpack-plugin for "index.html":
Asset Size Chunks Chunk Names
index.html 1.38 MiB 0
Entrypoint undefined = index.html
[../../AppData/Local/Yarn/Data/global/node_modules/lodash/lodash.js] C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/lodash/lodash.js 527 KiB {0} [built]
[../../AppData/Local/Yarn/Data/global/node_modules/vuepress-html-webpack-plugin/lib/loader.js!../../AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/index.dev.html] C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress-html-webpack-plugin/lib/loader.js!C:/Users/david/AppData/Local/Yarn/Data/global/node_modules/vuepress/lib/app/index.dev.html 454 bytes {0} [built]
[../../AppData/Local/Yarn/Data/global/node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 519 bytes {0} [built]`

[doerne]

Hi,
I am facing the same issues with using yarn and I can confirm when using npm it seems to work

[yyx990803]

Looks like this is a Yarn + Windows only issue, not sure if it's a Yarn bug.

[doerne]

@yyx990803: Sorry that I didn't insert my environment information earlier.
I am running a macOS system (10.13.4) with

• yarn 1.6.0
• node@8
• npm 5.6.0

So I think it's not a yarn & windows issue

[davidbernegger]

@doerne @yyx990803 I’m on windows 10 ( yarn 1.6.0, node 8 and npm 5.6.0 )

[mlcdf]

I'm having the same issue on Fedora 27 (node 8.11.0, yarn 1.5.1 and npm 5.6.0).

[dusty]

osx 10.13.4

> node -v
v9.11.1

> yarn -v
1.6.0

> yarn global list | grep vuepress
info "[email protected]" has binaries:
   - vuepress

> vuepress dev

  VuePress dev server listening at http://localhost:8080/

✖ ｢wdm｣: Hash: df8c7037fea1ab30f6f3
Version: webpack 4.6.0
Time: 11704ms
Built at: 04/17/2018 5:34:02 PM
           Asset       Size  Chunks             Chunk Names
assets/js/app.js   28.7 KiB     app  [emitted]  app
      index.html  320 bytes          [emitted]
Entrypoint app = assets/js/app.js
[0] multi /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js 28 bytes {app} [built]
[1] multi webpack-hot-client/client?42357525-74e9-4db1-a2e1-414e7747e69d /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js 40 bytes {app} [built]

ERROR in multi /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'buble-loader' in '/Users/dusty/tmp/press'
 @ multi /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js

ERROR in multi webpack-hot-client/client?42357525-74e9-4db1-a2e1-414e7747e69d /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'buble-loader' in '/Users/dusty/tmp/press'
 @ multi webpack-hot-client/client?42357525-74e9-4db1-a2e1-414e7747e69d /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js

ERROR in multi webpack-hot-client/client?42357525-74e9-4db1-a2e1-414e7747e69d /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'webpack-hot-client/client?42357525-74e9-4db1-a2e1-414e7747e69d' in '/Users/dusty/tmp/press'
 @ multi webpack-hot-client/client?42357525-74e9-4db1-a2e1-414e7747e69d /Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
Child html-webpack-plugin for "index.html":
         Asset      Size  Chunks  Chunk Names
    index.html  1.38 MiB       0
    Entrypoint undefined = index.html
    [../../.config/yarn/global/node_modules/lodash/lodash.js] /Users/dusty/.config/yarn/global/node_modules/lodash/lodash.js 527 KiB {0} [built]
    [../../.config/yarn/global/node_modules/vuepress-html-webpack-plugin/lib/loader.js!../../.config/yarn/global/node_modules/vuepress/lib/app/index.dev.html] /Users/dusty/.config/yarn/global/node_modules/vuepress-html-webpack-plugin/lib/loader.js!/Users/dusty/.config/yarn/global/node_modules/vuepress/lib/app/index.dev.html 454 bytes {0} [built]
    [../../.config/yarn/global/node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]

NOTE

I uninstalled via yarn global and added via npm -g and it works.

[sunzongzheng]

same
osx 10.13.4
yarn 1.6.0
node 8.11.1

[ghost]

same issue on ubuntu16.04 gnome3.20.4

• node 8.9.4
• yarn 1.5.1
• npm 5.6.0

but install via npm works

[Deguang]

same issue on macOS High Sierra 10.13.4

• node 9.0.0
• yarn 1.6.0

[yyx990803]

Can someone confirm that:

1. buble-loader is present in yarn's global install location
2. Whether changing this line to .loader(require.resolve('buble-loader')) fixes the issue?

[mlcdf]

1. Yes.

~/.config/yarn/global/node_modules
❯ tree | grep "buble-loader"
├── buble-loader

1. The problem is now on vue-loader.

RROR in /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/app.js
Module not found: Error: Can't resolve 'vue-loader' in '/home/maxime/Code/test'
 @ /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/app.js 6:0-32 46:13-21
 @ /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
 @ multi /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js

ERROR in /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/.temp/routes.js
Module not found: Error: Can't resolve 'vue-loader' in '/home/maxime/Code/test'
 @ /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/.temp/routes.js 4:0-26
 @ /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/app.js
 @ /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
 @ multi /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js

ERROR in multi webpack-hot-client/client?fdfe24da-2407-41a9-a098-58465efad697 /home/maxime/.config/yarn/global/node_modules/vuepress/lib/app/clientEntry.js
Module not found: Error: Can't resolve 'webpack-hot-client/client?fdfe24da-2407-41a9-a098-58465efad697' in '/home/maxime/Code/test'

[mlcdf]

And, FWiW, replacing .loader('vue-loader') by .loader(require.resolve('vue-loader')) "moves" the issue to vue-style-loader.

[dhensche]

okay, so after looking closer at how npm installs via npm -g vuepress vs yarn installs yarn global add vuepress, npm actually puts all the dependencies in node_modules while yarn does not. I believe this is why module resolution is failing with yarn global install.

edit: double checked by altering my global vuepress install createBaseConfig.js to do

config.resolveLoader
    .set('symlinks', true)
    .modules
      // prioritize our own
      .add(path.resolve('/Users/dhensche/.nvm/versions/node/v8.9.4/lib/node_modules/vuepress/node_modules/'))
      .add('node_modules')

so that it pointed at the node_modules directory of the npm install instead of the yarn install and that worked

also, this explains why vuepress installed locally via yarn works (athough the local node_modules/vuepress/node_modules is empty besides a .bin directory, the addition of node_modules (.add('node_modules')) when creating the webpack config causes webpack to search the local node_modules (where yarn installs all of vuepress-es deps)

[dhensche]

Possible solution (athough I don't know if I am a fan)

config.resolveLoader
    .set('symlinks', true)
    .modules
      // assuming vuepress is installed via npm/yarn, this searches the node_modules directory it is installed in
      .add(path.resolve(__dirname, '../../..'))
      // support running vuepress from a development version
      .add(path.resolve(__dirname, '../../node_modules'))
      .add('node_modules')

[bparanj]

Mac OS : 10.13.6
yarn : 1.12.1
node : v10.13.0
npm : 6.4.1

I am getting:

ERROR in /usr/local/lib/node_modules/vuepress/lib/app/clientEntry.js
Module build failed (from /usr/local/lib/node_modules/vuepress/node_modules/cache-loader/dist/cjs.js):
TypeError: Cannot read property '_statStorage' of undefined
    at stat (/usr/local/lib/node_modules/vuepress/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:231:8)
    at toDepDetails (/usr/local/lib/node_modules/vuepress/node_modules/cache-loader/dist/index.js:66:5)
    at arrayIterator (/usr/local/lib/node_modules/vuepress/node_modules/neo-async/async.js:3780:9)
    at timesSync (/usr/local/lib/node_modules/vuepress/node_modules/neo-async/async.js:2292:7)
    at Object.mapLimit (/usr/local/lib/node_modules/vuepress/node_modules/neo-async/async.js:3775:5)
    at Array.<anonymous> (/usr/local/lib/node_modules/vuepress/node_modules/cache-loader/dist/index.js:89:18)
    at arrayEachFunc (/usr/local/lib/node_modules/vuepress/node_modules/neo-async/async.js:2512:19)
    at Object.parallel (/usr/local/lib/node_modules/vuepress/node_modules/neo-async/async.js:6867:9)
    at Object.loader (/usr/local/lib/node_modules/vuepress/node_modules/cache-loader/dist/index.js:88:9)
 @ multi /usr/local/lib/node_modules/vuepress/lib/app/clientEntry.js app[0]