css - Vue.js 和 webpack：在开发中使用 peerDependencies，但不将它们包含在生产构建中

Question

我想为现有库创建一个插件（我们称之为它LIB-X，但它可以是任何东西，如 Bootstrap/Bulma/Antdv 等（是的，我正在寻找一个通用解决方案来解决这个问题），它有自己的我想要使​​用的一组 Web 组件和样式表。

我已将其添加LIB-X为我的项目中的对等依赖项。我LIB-X-INPUT在我的插件中使用 web 组件，并且我在我的组件的样式表中使用 SASS 变量（例如，用于填充、边距、颜色等，因此我必须将它包含在我的组件的 sass 部分中@import ~LIB-X/scss/variables.scss）。

我在 Webpack 配置中指出了我的LIB-X其中之一。externals

一切正常，但整个LIB-X样式表在构建后包含在dist文件夹中 - 我怎样才能避免这种情况，并且在构建过程中，只“即时”转换必要的东西，而不是将其包含在最终构建中？甚至可能吗？

另一种形式的问题：是否可以peerDependencies在本地主机上和构建过程中强制 webpack 用作全局可访问的包（因此它知道如何将 SCSS 变量转换为 CSS），但它不会包含这些文件本身在最终版本中？

使用 Vue.js 2，该项目是通过 Vue-CLI 创建的。

标签： cssvue.jswebpacksassvuejs2