首页 文章

vuejs：vue-cli webpack模板无法解析sass导入

提问于
浏览 次
1

当从Sass编译样式并从节点模块导入时，我遇到了webpack / vue-cli的问题 .

我无法找到正确解决 node_module 中的 node_module 的方法 .

@import '~bootstrap/dist/css/bootstrap.min.css';  // not working, cannot resolve path (sass-loader syntax)
@import '../node_modules/bootstrap/dist/css/bootstrap.min.css';  //works, needs full relative paths

这似乎归结为两个问题：

  • sass-loader不用于解析从node_module（~module）的导入，尽管是由vue-cli为sass配置的加载器
    *使用postcss-import，但 node_module 文件夹没有映射，因此需要相对路径 . 在这种情况下，内部依赖项（例如，通过 url() 加载的字体以及从node_modules导入的样式中的相对路径）未解析 .

有任何想法吗？
TIA

webpack vue.js sass vue-cli vue-loader

2 回答

  • 0

    据我所知，你不应该将构建css文件导入你的sass . 而只是在你的main.js中导入它：

    import 'bootstrap/dist/css/bootstrap.min.css'
    回复于
  • 1

    尝试安装 node-sass 和 sass-loader

    npm install --save-dev node-sass sass-loader

    如果您正在使用它，请随意用 yarn 替换 npm .

    此外，您可以通过以下方式导入引导程序

    @import "~bootstrap";
    回复于

相关问题