css - 解决 npm 模块依赖

标签 css node.js webpack vue.js

对于一个元素,我正在使用我构建的库,以便在不同的应用程序之间共享 Vue 组件。

因此,我将我的组件库作为 npm 模块导入,并将其添加到应用程序 package.json 中,一切正常。

问题是,当我尝试在组件库中的单个组件中导入某些内容时,应用程序无法解决该组件的依赖关系。

例如组件库中的组件:

  <template>
    <!-- my html -->
  </template>
  </script>
    // my script
  </script>

  <style scoped>
  // here I import the basic style for the component:
  @import "../../assets/base";

在应用程序 package.json 中我有:

  "components": "git+ssh://git@git.xxxxx.com:xxxxx/xxxxx/my-library.git#development",

然后我像这样在我的元素中正常使用该组件:

  import MyComponent from "./components/MyComponent.vue";

组件库工作正常,但是当我在应用程序中导入组件时,我从 webpack 收到以下错误:

This dependency was not found:

* -!../../../../css-loader/index.js?sourceMap!../../assets/base in ./~/css-loader?sourceMap!./~/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-28803148","scoped":true,"hasInlineConfig":false}!./~/vue-loader/lib/selector.js?type=styles&index=0!./~/components/src/core/MyComponent.vue
To install it, you can run: npm install --save -!../../../../css-loader/index.js?sourceMap!../../assets/base

当然,如果我用实际需要的 css 替换 @import,一切正常。我怎样才能让这个配置起作用?

最佳答案

我的错,错误只是没有在组件的样式声明中添加 lang="scss":

  <style scoped>

这应该是:

  <style scoped lang="scss">

关于css - 解决 npm 模块依赖,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45284012/

相关文章:

html - 试图让颜色显示

javascript - 在轮播中添加新元素会在 Angular4 中添加新行

javascript - 无法使用 Node 下载 S3 对象

node.js - 安全比较和简单的 ==(=) 之间有什么区别

webpack - 带有 Webpack 4 的 Chrome 扩展生成错误的输出

javascript - 当有多个链式加载器时,一致的 webpack 选项

html - 两个盒子没有正确放置自己,但另一个盒子可以

ruby-on-rails - rails simple_form 禁用表单类?

javascript - 自动将参数传递给 res.render nodejs

css - `/deep/` 选择器无法在我的 VueJS 应用程序中使用 sass-loader