时间戳

首页 > 解决方案 > 创建一个包含 SCSS 的节点 (vue.js) 模块

vue.js - 创建一个包含 SCSS 的节点 (vue.js) 模块

问题描述

我想为在我们的存储库中共享的其他项目创建一个 npm 模块。我的“库”包含一些 vue.js 基本组件和一些 SCSS。我想重用这个基本的 scss 和组件。

我也在我的组件中使用相同的 SCSS。以下是库组件的示例摘录：

<style scoped lang="scss">
@import "./src/assets/css/variables.scss";
....
</style>

现在我想在我的主项目中重用这个组件，但是 sass 加载器通过引用这个 variables.scss 失败（在我的库模块中）。那么这条路显然行不通。我应该做一些类似“../assets/css/variables.scss”的事情来在库构建和项目构建中工作......当我使用嵌套文件夹时也有一些警告。

我想知道在互联网上找到这么少的信息。有人可以给我一个“如何正确做”的建议吗？

提前致谢！

标签： vue.jsnpmsass

解决方案

如果我理解正确，您希望将变量 sass 文件导入“子项目”。

在这种情况下，当你构建了你的 npm “library” 包时，你可以在你安装它的子项目中通过包名来引用它：

<style scoped lang="scss">
@import "library-name/assets/css/variables.scss";
....
</style>

推荐阅读