0

我一直ts-loader在 Webpack 中使用。我还想ExtractTextPlugin结合使用css-loader来捆绑 CSS。但是,当与它一起使用时,ExtractTextPlugin似乎被忽略或覆盖。ts-loader我在下面包含了一个示例 webpack.config.js。有可能解决这个问题吗?

{
    entry: './src/app.ts',
    resolve:
    {
        extensions:
        [
            '.js',
            '.html',
            '.css'
        ]
    },
    output:
    {
        filename: 'app.js',
        path: path.resolve(__dirname, 'deploy')
    },
    watch: true,
    watchOptions:
    {
        ignored: /node_modules/
    },
    module:
    {
        rules:
        [
            {
                use: ExtractTextPlugin.extract(
                {
                    fallback: 'style-loader',
                    use: 'css-loader'
                }),
                test: /\.css$/,
                exclude: /node_modules/
            },
            {
                loader: 'ts-loader',
                test: /\.tsx?$/,
                exclude: /node_modules/
            },
            {
                loader: 'svelte-loader',
                test: /\.html$/,
                exclude: /node_modules/
            }
        ]
    },
    plugins:
    [
        new ExtractTextPlugin(
        {
            filename: 'app.css',
            allChunks: true
        })
    ]
}

更新

当出现 TypeScript 错误时,似乎ExtractTextPlugin不会在此上下文中运行。这可以通过修复这些错误来解决。一个不太优雅的解决方案是将导入样式的文件更改.ts.js. 这会将其从 TypeScript 中删除,因此错误不会阻止ExtractTextPlugin运行。

4

0 回答 0