как предотвратить мини-CSS-экстракт-плагин от создания js entrypint - PullRequest
Новая
       14

как предотвратить мини-CSS-экстракт-плагин от создания js entrypint

0 голосов
/ 29 августа 2018

Я относительно новичок в Express + Webpack, поэтому мне неясно, предназначено это или нет, и если нет, то как правильно его настроить. вопрос заключается в дополнительном ресурсе и точке входа, созданных при использовании mini-css-extract-plugin.

Конфигурация веб-пакета: 

Extract = require('mini-css-extract-plugin');
path = require('path');
Write = require('write-file-webpack-plugin');

module.exports = {
  mode: 'development',
  entry: {
    demo_scripts: path.resolve('server', 'scripts', 'demo.js'),
    demo_styles: path.resolve('server', 'styles', 'demo.css')
  },
  output: {
    path: path.resolve('.tmp'),
    filename: '[name].js'
  },
  plugins: [new Write(), new Extract()],
  module: {
    rules: [
      {
        test: /\.js$/,
        use: [
          {
            loader: 'babel-loader',
            options: {
              presets: ['babel-preset-env']
            }
          }
        ]
      },
      {
        test: /\.css/,
        use: [
          {
            loader: Extract.loader
          },
          {
            loader: 'css-loader'
          }
        ]
      }
    ]
  }
};

выход веб-пакета 

          Asset      Size        Chunks             Chunk Names
demo_scripts.js  3.91 KiB  demo_scripts  [emitted]  demo_scripts
demo_styles.css  36 bytes   demo_styles  [emitted]  demo_styles
 demo_styles.js  3.89 KiB   demo_styles  [emitted]  demo_styles
Entrypoint demo_scripts = demo_scripts.js
Entrypoint demo_styles = demo_styles.css demo_styles.js

мой вопрос: почему создается demo_styles.js? хотя css извлекается, кажется, что webpack все еще создает пакет js с css, но когда я просматриваю этот файл, единственная строка в нем - 

eval("// extracted by mini-css-extract-plugin\n\n//# sourceURL=webpack:///./server/styles/demo.css?");

Может кто-нибудь помочь объяснить, что здесь происходит?

UPDATE

если я удаляю точку входа demo_styles и настраиваю ее через плагин init, ресурс css не создается. 

({
  plugins: [
    new Write(),
    new Extract({
      filename: 'demo_styles.css'
    })
  ]
});

Asset      Size        Chunks             Chunk Names
demo_scripts.js  3.91 KiB  demo_scripts  [emitted]  demo_scripts
Entrypoint demo_scripts = demo_scripts.js

репо для этого здесь (обратите внимание на экспресс-ветку) https://github.com/brewster1134/bumper/tree/express

1 Ответ

0 голосов
/ 29 августа 2018

Пожалуйста, удалите demo_styles из вашей точки входа, это создает demo_styles.js.

вместо этого вы можете вставить файл CSS следующим образом: 

plugins: [
      new MiniCssExtractPlugin({
        filename: 'demo_styles.css',
      }),

Дайте мне знать, если проблема не устранена. Рад помочь

...