Cannot use Vue with browserify (regression)

[ernestoalejo]

Vue.js version

2.0.6

Reproduction Link

https://github.com/ernestoalejo/vue-repro
(only 3 files, it's very simple)

Steps to reproduce

1. clone the repo
2. npm install
3. gulp

What is Expected?

To build the app correctly.

What is actually happening?

After the commit a4fcdbe it requires the "he" package and it can't found it:

Error: Cannot find module 'he' from '/.../vue-repro/node_modules/vue/dist'
    at /.../vue-repro/node_modules/browserify/node_modules/resolve/lib/async.js:46:17
    at process (/.../vue-repro/node_modules/browserify/node_modules/resolve/lib/async.js:173:43)
    at ondir (/.../vue-repro/node_modules/browserify/node_modules/resolve/lib/async.js:188:17)
    at load (/.../vue-repro/node_modules/browserify/node_modules/resolve/lib/async.js:69:43)
    at onex (/.../vue-repro/node_modules/browserify/node_modules/resolve/lib/async.js:92:31)
    at /.../vue-repro/node_modules/browserify/node_modules/resolve/lib/async.js:22:47
    at FSReqWrap.oncomplete (fs.js:82:15)

[maiermuc]

same issue with webpack-simple

Steps to reproduce
https://github.com/vuejs-templates/webpack-simple

$ npm install -g vue-cli
$ vue init webpack-simple my-project
$ cd my-project
$ npm install
$ npm run dev

following issue

ERROR in ./~/vue/dist/vue.js
Module not found: Error: Can't resolve 'he' in 'test\node_modules\vue\dist'
 @ ./~/vue/dist/vue.js 5762:11-24
 @ ./src/main.js
 @ multi main

[ernestoalejo]

It's somewhat difficult to workaround this bug because we cannot use an old version easily (npm resolves vueify>vue-template-compiler using ^2.0.0-alpha.8 and that's always vue-template-compiler@2.0.6 even if we want to use a different version). We now need to add yarn or shrinkwrap to the project.

[defcc]

@ernestoalejo, it works well on my computer according to your steps, anything else missed ?

[yyx990803]

For now the workaround is do not parse vue/dist/vue.js for requires - browserify has the noparse flag and Webpack has the module.noParse option.

We will fix it in the next release.

same issue when using jspm with vue@2.0.6
rolling back to vue@2.0.5 solves it for now

[ernestoalejo]

Unrelated, but I tried with:

    var bundle = browserify({
      noParse: ['node_modules/vue/dist/vue.js'],
    });

and a quick console.log inside babel code here says the file is filtered correctly. It stills throws the error though, after all files pass the filter. Probably there is some other option I have not consider here.

[zhanghaowx]

The workaround for webpack is add he to externals

[yyx990803]

This has been reverted/fixed in 2.0.7.

[chisumo2016]

For some reason I can't import .vue files on a completly fresh vue init webpack-simple folder.
I can run npm run dev initially, but as soon as I try to import a .vue component, this error occurrs:

./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue
Module not found: Error: Can't resolve './components/Header.vue' in 'C:\laragon\www\vue-tutorials\vue-cli-tutorial\vuejs-router-vue-router\src'
@ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue 16:0-45
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8082 webpack/hot/dev-server ./src/main.js