无法导入由vue-cli-service构建的Vue组件

Question

我在Vue中很新，也许我的问题很琐碎。

我要做的是：

我想创建一个Vue组件，可以将其放入NPM专用存储库中，然后使用bundle.js文件之类的东西将其导入其他项目中

TLDR：

无法通过vue-cli-service build --target lib / wc导入vue组件构建。导入组件我有silimar"export 'HelloWorld' was not found in '../node_modules/hello-world'

长版：

我已尽可能地提出问题和项目。所有项目均由vue-cli构建，没有任何其他更改。

• 1. 创建新的默认项目 vue create hello-world
• 2. 默认情况下，我们在这里有第一个组件- src/component/HelloWorld，对于本示例，这是我们要导出的组件
• 3. 使用vue-cli-service尝试制作可导出文件。

• 3a。vue-cli-service build --target lib --name vue-test ./src/components/index.jsindex.js在哪里

  import Vue from 'vue';
  import HelloWorld from './HelloWorld.vue';
  
  const Components = {
      HelloWorld,
  };
  
  Object.keys(Components).forEach((name) => {
      Vue.component(name, Components[name]);
  });
  
  export default Components;
  

• 3b。或直接查看文件vue-cli-service build --target wc --name vue-test 'src/components/HelloWorld.vue'

在两种情况下都会将vue-cli-service我的文件生成到/dist文件夹中，我想相信此文件是正确的

在两种情况下，我都无法使用import {HelloWorld} from 'path/to/folder/or/file';或将组件导入到另一个vue项目require('path/to/folder/or/file')。似乎束文件尚未导出成员。

我做错了什么？应该用build --target wc还是build --target lib？

---

如果您不想创建新的应用程序来重现此问题，U可以从https://github.com/okosowski/vueTest（使用vue cli开始的项目）中下载回购。

1. git clone
2. npm install
3. npm run build-bundle-lib 要么 npm run build-bundle-lib
4. npm link 或只是将文件复制到现有的vue项目
5. 尝试导入/显示 HelloWorld

我将不胜感激！谢谢

---

节点v10.14.2

npm 6.4.1

vue-Cli 2.9.6（与3.3.0相同）

https://github.com/okosowski/vueTest/blob/master/package.json中的其他二手版本

Answer 1

在使用 vue-cli 构建和测试我的 Vue 组件时，我遇到了同样的问题。幸运的是，在将其作为错误报告给 GitHub 上的 vue-cli 问题跟踪器后，我找到了解决方案。结果发现 common.js 文件没有任何问题，也不是一个错误。

无论如何......长话短说，您尝试导入的现有项目无法解析符号链接（因为这就是您使用 npm 链接时发生的情况）。为了解决您的问题，您需要将以下内容添加到要导入的项目根文件夹中的 vue.config.js 中：

// vue.config.js
module.exports = {
    chainWebpack: config => config.resolve.set('symlinks', false)
}

希望这可以帮助。欲了解更多信息，请查看以下链接：

我在 vue-cli 跟踪器
Webpack 配置中的问题报告：resolve.symlinks