在另一个仓库中导入 vue-cli 应用程序时出错答案

【问题标题】：Error when importing vue-cli app in another repo在另一个仓库中导入 vue-cli 应用程序时出错
【发布时间】：2018-09-26 14:30:56
【问题描述】：

我使用 vue-cli 3 创建了一个组件库，然后将其拉入另一个 repo 以使用这些组件。现在我得到了错误：

Uncaught Error: Module build failed: Error: Couldn't find preset "@vue/app" relative to directory "/{path_to_project}/node_modules/{vue_cli_app}"
    at {path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:293
    at Array.map (<anonymous>)
    at OptionManager.resolvePresets ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275)
    at OptionManager.mergePresets ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264)
    at OptionManager.mergeOptions ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249)
    at OptionManager.init ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368)
    at File.initOptions ({path_to_project}/node_modules/babel-core/lib/transformation/file/index.js:212)
    at new File ({path_to_project}/node_modules/babel-core/lib/transformation/file/index.js:135)
    at Pipeline.transform ({path_to_project}/node_modules/babel-core/lib/transformation/pipeline.js:46)
    at transpile ({path_to_project}/node_modules/babel-loader/lib/index.js:50)
    at Object.module.exports ({path_to_project}/node_modules/babel-loader/lib/index.js:175)
    at {path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:293
    at Array.map (<anonymous>)
    at OptionManager.resolvePresets ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275)
    at OptionManager.mergePresets ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264)
    at OptionManager.mergeOptions ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249)
    at OptionManager.init ({path_to_project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368)
    at File.initOptions ({path_to_project}/node_modules/babel-core/lib/transformation/file/index.js:212)
    at new File ({path_to_project}/node_modules/babel-core/lib/transformation/file/index.js:135)
    at Pipeline.transform ({path_to_project}/node_modules/babel-core/lib/transformation/pipeline.js:46)
    at transpile ({path_to_project}/node_modules/babel-loader/lib/index.js:50)
    at Object.module.exports ({path_to_project}/node_modules/babel-loader/lib/index.js:175)
    at Object.__webpack_exports__.a (aggregation.bundle.js:13)
    at __webpack_require__ (bootstrap ec9b411d2dc4def5406f:54)
    at Object.<anonymous> (select.vue:1)
    at __webpack_require__ (bootstrap ec9b411d2dc4def5406f:54)
    at Object.Array.concat.path (vue-multi-select.component.js:11)
    at __webpack_require__ (bootstrap ec9b411d2dc4def5406f:54)
    at Object.Array.concat._extends (app-files.generated.js:86)
    at __webpack_require__ (bootstrap ec9b411d2dc4def5406f:54)
    at Object.Array.concat.module.exports (app.js:111)
    at __webpack_require__ (bootstrap ec9b411d2dc4def5406f:54)

这是来自 vue-cli 项目中自动生成的.babelrc：

{
  "presets": [
    "@vue/app",
    "vue"
  ]
}

有没有办法更改.babelrc 引用，以便在其他地方导入时可以使用它？

【问题讨论】：

标签： vue.js vue-cli

【解决方案1】：

我不认为正确的方法是从导入库的项目中引用 .babelrc。我的解决方案是：

在导出之前编译库
构建到 dist 目录中
将构建好的 dist 目录导入到正在使用该库的项目中。

我相信 babel 可以做一些简单的事情，比如babel -d ./dist 来构建目录，你可以看文档here

【讨论】：