如何在不生成JS文件的情况下生成CSS文件？

问题描述

我正在尝试为一个项目设置Webpack配置，该配置会生成许多将在iframe中加载的页面。这些iframe共享许多CSS，我希望将共享的CSS（诸如CSS重置，排版规则等之类的东西）编译（使用postcss）到一个CSS文件中，同时保留每个单独页面专用的CSS在单独的文件中。我已经通过以下方式通过几乎做正确的webpack配置：

module.exports = {
  optimization: {
    usedExports: true,splitChunks: {
      cacheGroups: {
        styles: {
          name: 'global',test: /global.css$/,chunks: 'all',enforce: true,},entry: [
    one: './entries/one.js',two: './entries/two.js',],...
  output: {
    path: __dirname + '/dist',filename: '[name].js',chunkFilename: '[name].[id].js',module: {
    rules: [
      {
        test: /\.svelte$/,use: {
          loader: 'svelte-loader-hot',options: {
            dev,hotReload: true,emitCss: true,{
        test: /\.css$/,use: [
          {
            loader: MiniCssExtractPlugin.loader,options: {
              publicPath: '/dist',hmr: dev,reloadAll: true,...
            },'css-loader','postcss-loader',plugins: [
    new CleanWebpackPlugin(),new MiniCssExtractPlugin({}),...
};

条目如下所示：

import App from '../src/js/App.svelte';
import css from '../src/css/global.css';

const app = new App({
  target: document.body,});

window.app = app;

export default app;

这可以通过以下方式工作：输出版本生成单个global.css文件，并且所有生成的端点都将其导入。 但是它还会生成完全无用的global-0.js：

(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{11:function(n,w,o){}}]);

，并且所有端点也都加载了此文件。这意味着加载页面的客户端将需要打开另一个连接并下载完全无用的文件，我宁愿避免。有什么方法可以使webpack不再打扰这个无用的JS文件，并仅生成 CSS文件？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）