Angular引入node_modules里面的css文件出错Module build failed：TypeError：URL.startsWith is not a function

骑猪看日落 2022-05-31 03:09 575阅读 0赞

![SouthEast][]

问题困扰了好几天，原来是路径的问题。

1.目录结构如下：

![SouthEast 1][]

2.webpack配置：

"include": [
     path.join(process.cwd(), "src/styles.css")
     ],
        "test": /\.css$/,
            "use": [
            "style-loader",
             {
               "loader": "css-loader",
               "options": {
                     "sourceMap": false,
                     "importLoaders": 1
                 }
              },
             {
                 "loader": "postcss-loader",
                 "options": {
                     "ident": "postcss",
                     "plugins": postcssPlugins
                  }
              }
        ]

3.在styles.css中引入（ 路径很重要）：

@import '~/../node_modules/@angular/material/prebuilt-themes/indigo-pink.css';

*注：所有在styles里面import的css文件都会被webpack打包到style.css，所以如果两个css对同一个元素标签起作用，请把要实现的样式import到后面。也就是重要的放在后面。*

[SouthEast]: /images/20220531/e561b5a8779c4dfca62ea4ae373c9c17.png
[SouthEast 1]: /images/20220531/136a4ed1bdba4a55b98087660db62026.png

发表评论取消回复

表情：

评论列表（有 0 条评论，575人围观）

还没有评论，来说两句吧...

相关阅读

相关 Module build failed: TypeError: this.getResolve is not a function 安装node-sass运行报错

问题：在Vue-cli的项目中安装了`node-sass`和`sass-loader`，安装命令如下： cnpm install node-sass sass

傷城~/ 2023年07月11日 15:00/ 0 赞/ 12 阅读

相关 blucesun 解决npm报错：Module build failed: TypeError: this.getResolve is not a function

[blucesun][] [解决npm报错：Module build failed: TypeError: this.getResolve is not a functio

布满荆棘的人生/ 2023年05月31日 07:08/ 0 赞/ 8 阅读

相关 Angular报错：ERROR TypeError: control.setParent is not a function

Angular报错：ERROR TypeError: control.setParent is not a function 这里是定义的 myForm ，字段 imageI

水深无声/ 2023年01月12日 11:54/ 0 赞/ 259 阅读

相关 vue---使用stylus报错 Module build failed: TypeError: loaderContext.getResolve is not a function

问题：在vue-cli使用stylus库的项目中，运行项目报错loaderContext.getResolve is not a function ![watermark_t

浅浅的花香味﹌/ 2022年12月22日 11:07/ 0 赞/ 127 阅读

相关 vue 中使用scss, 报错 Module build failed: TypeError: loaderContext.getResolve is not a function

使用步骤： 1.打开终端，安装sass依赖包 npm install --save-dev sass-loader //sass-loader依赖于node

Dear 丶/ 2022年11月28日 10:34/ 0 赞/ 206 阅读

相关 jQuery—$ is not a function

昨天编写代码，在使用jQuery获取input值时浏览器控制台显示“$ is not a function”，查看自己写的代码，发现没有写错，于是查找各种资料，

以你之姓@/ 2022年08月21日 00:22/ 0 赞/ 254 阅读

相关 Angular 1.6提示$http.get(...).success is not a function

1.在使用Angular 1.6版本的$http服务时会抛出异常：$http.get(...).success is not a function 或者$http(...).

痛定思痛。/ 2022年07月11日 15:26/ 0 赞/ 145 阅读

相关 Angular引入node_modules里面的css文件出错Module build failed：TypeError：URL.startsWith is not a function

![SouthEast][] 问题困扰了好几天，原来是路径的问题。 1.目录结构如下： ![SouthEast 1][] 2.webpack配置： "i

骑猪看日落/ 2022年05月31日 03:09/ 0 赞/ 576 阅读

相关 webpack里面使用layui依赖出错 Layui hint: carousel is not a valid module

问题：在我项目里面引用了layui，但是报了一个404错误。我引用了 layui.css 和 layui.js 结果给我报了一个。找不到 carousel.js。一脸懵

阳光穿透心脏的1/2处/ 2022年05月14日 05:58/ 0 赞/ 511 阅读

相关 Module build failed: TypeError: this.getResolve is not a function

这是因为当前sass的版本太高，webpack编译时出现了错误，这个时候只需要换成低版本的就行. 卸载当前版本，并安装低版本的 sass-loader 即可。公众号：C

拼搏现实的明天。/ 2021年08月31日 02:55/ 0 赞/ 292 阅读