发布的 vue 组件没有 css (NPM)

Posted 2023-02-22

【中文标题】发布的 vue 组件没有 css (NPM)

【英文标题】：Published vue component has no css (NPM)

【发布时间】：2020-03-19 19:05:53

【问题描述】：

这是我第一次将 Vue 组件发布到 NPM，一切正常，除了 CSS 不存在。当我在本地运行它时，一切都按预期工作，但如果我创建一个测试项目，安装 npm 包并导入组件，则没有 CSS。

重现步骤：

新建一个 Vue 项目 运行npm install elementable-vue 将此模板用于 App.vue：https://github.com/sandermaas/elementable-vue/blob/master/src/App.vue 将导入（在模板中）更改为import ElemenTable from 'elementable-vue' 运行'npm run serve'

您可以在https://github.com/sandermaas/elementable-vue查看源代码

我不知道为什么这不起作用，因此非常感谢任何帮助。

【参考方案1】：

您还需要在新创建的项目的 app.vue 中导入您的 css：

<style>
  @import '~elementable-vue/dist/elementable-vue.css';
</style>

【讨论】：

总是需要这样做吗？有没有办法在组件中自动包含 CSS？

我可能是错的，但 AFAIK 也需要导入您的 css。我不太确定是否有办法自动导入。