更改 browserify-shim 名称会导致编译错误

Question

好的，所以我一直在尝试用 browserify 和 vueify 编译东西，我偶然发现了一些奇怪的东西。因此，首先，我一直在尝试让找到的 browserify-simple 示例 here 正常工作。

我已经设置好并且能够编译并让事情正常工作。但是，我决定尝试添加 browserify-shim 以避免在最终代码中嵌入 vue.js 库。

这就是事情变得有点奇怪的地方。这是我的 package.json 文件的功能版本。其中大部分已经在示例中出现，我只添加了必要的配置以使 browserify-shim 工作：

{
  "name": "un-test",
  "description": "Un test",
  "author": "John Doe",
  "private": true,
  "scripts": {
    "watchify": "watchify -vd -p browserify-hmr -e src/main.js -o dist/build.js",
    "serve": "http-server -o -s -c 1 -a localhost",
    "dev": "npm-run-all --parallel watchify serve",
    "build": "cross-env NODE_ENV=production browserify -g envify src/main.js | uglifyjs -c warnings=false -m > dist/build.js"
  },
  "dependencies": {
    "vue": "^2.0.1"
  },
  "devDependencies": {
    "babel-core": "^6.0.0",
    "babel-preset-es2015": "^6.0.0",
    "babelify": "^7.2.0",
    "browserify": "^13.0.1",
    "browserify-hmr": "^0.3.1",
    "browserify-shim": "^3.8.14",
    "cross-env": "^1.0.6",
    "envify": "^3.4.1",
    "http-server": "^0.9.0",
    "npm-run-all": "^2.1.2",
    "uglify-js": "^2.5.0",
    "vueify": "^9.1.0",
    "watchify": "^3.4.0"
  },
  "browserify": {
    "transform": [
      "vueify",
      "babelify",
      "browserify-shim"
    ]
  },
  "browserify-shim": {
    "vue": "global:Vue" 
  }
}

正如我所说，这行得通。另一方面，如果我在 package.json:

中执行此操作

"browserify-shim": {
        "myVue": "global:Vue" 
      }

如果我像这样相应地修改 main.js 文件：

import Vue from 'myVue'
import App from './App.vue'

new Vue({
  el: '#app',
  render: h => h(App)
})

编译时出现如下错误：

Error: Cannot find module 'vue' from 'C:\wamp\www\VueTest\src'

谁能告诉我为什么会这样？除了导入我想要的库之外，我不认为我在 browserify-shim 部分中输入的名称真的很重要。

Answer 1

好吧，我能够将问题追溯到 vueify 模块。在所述模块的 compiler.js 文件中有对 "vue" 模块的硬编码引用。这会强制你在 browserify-shim 中准确命名你的模块 "vue" 否则如果你在开发模式下编译你会得到一个错误。

我为感兴趣的人开了一个问题here。但是最近 activity 的情况不多，所以我不知道 if/when 它会得到修复。无论如何，如果您想避免此错误，只需将您的模块命名为 "vue" 或使用 NODE_ENV=production 参数更改您的编译模式。

更改 browserify-shim 名称会导致编译错误

changing browserify-shim name causes compilation error

browserify

vue.js

vueify