Angular 角度2掷';cssText.replace不是一个函数';使用ExtractTextPlugin时
我有两个项目:Angular 角度2掷';cssText.replace不是一个函数';使用ExtractTextPlugin时,angular,webpack,webpack-style-loader,extract-text-plugin,Angular,Webpack,Webpack Style Loader,Extract Text Plugin,我有两个项目:项目A和项目B 项目A Webpack@2.2.1 提取文本网页包-plugin@2.0.0-rc.3 角度2.4.3 项目B 角度2.4.3 项目B为项目a提供了一系列模块/组件 代码由Project B编译(未捆绑)到dist文件夹中,然后由Project a通过npm链接使用 现在,使用ExtractTextPlugin的webpack.common.js设置,浏览器会抛出一个异常: Angular 2会引发此异常,但只有在使用此插件时才会引发。 我这么说是因为,如果我使用
项目A
和项目B
项目A
项目B
为项目a
提供了一系列模块/组件
代码由Project B
编译(未捆绑)到dist文件夹中,然后由Project a
通过npm链接使用
现在,使用ExtractTextPlugin
的webpack.common.js
设置,浏览器会抛出一个异常:
Angular 2会引发此异常,但只有在使用此插件时才会引发。
我这么说是因为,如果我使用原始加载程序加载.css
扩展,一切正常,但使用ExtractTextPlugin时,它就坏了
有效
webpack.config.js
输出:
无效(使用ExtractTextPlugin)
webpack.config.js
输出:
引发异常:
Uncaught TypeError: cssText.replace is not a function
at extractStyleUrls (http://localhost:8080/vendor.js:75001:52)
节点:6.2.0
OS:macOS Sierra(10.12.2)我遇到了这个问题,因为我有一个@Component
样式URL
引用了一个有效的样式表文件,但该文件是空的。删除不必要的styleUrl
为我解决了这个问题。检查本节中的答案
除了答案之外,您可以使用require
,也可以简单地import
导入component.ts文件上方的.css
文件
比如导入“../assets/app.css”
尝试在包.json中的依赖项中添加“angular2模板加载器”:“^0.6.2”
,然后执行npm i
。这解决了我同样的问题看看这是否有帮助,是否对我有效:
module: {
rules: [
{
test: /\.css$/,
use: ExtractTextPlugin.extract( {
fallback: "raw-loader",
use: [ "raw-loader" ]
} )
}
}
},
plugins: [
new ExtractTextPlugin( "[name].css" ),
]
Uncaught TypeError: cssText.replace is not a function
at extractStyleUrls (http://localhost:8080/vendor.js:75001:52)