WebPack: не создаёт финальный дистрибутив

01K

Мой дом здесь!
Регистрация
27 Июн 2013
Сообщения
708
Реакции
343
Всем привет!
Мучаюсь с WebPack 3.6.
Не получается скомпилировать финальный проект. Точнее с закомментированными модулями build проходит, в браузере проект крутится, но финальный дистрибутив не создаётся. Папка пустая. Как мне кажется - дело в путях, но пока ошибки не нашёл.

Для примера, вот простой конфиг для dev, который работает тоже только в браузере:
Код:
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackPluginConfig = new HtmlWebpackPlugin({
  template: './index.html',
  filename: 'index.html',
  inject: 'body'
})
module.exports = {
  entry: './index.js',
  output: {
  filename: 'bundle.js'
  },
  module: {
   loaders: [
  {
  test: /\.json$/,
     exclude: /node_modules/,
  loader: 'json-loader'
  },
    {
     test: /\.css$/,
     loader: "style-loader!css-loader"
  }
  ],
  rules: [
  {
  test: /\.js$/,
  exclude: /(node_modules)/,   
  use: {
  loader: 'babel-loader',
  options: {
  presets: ['env', 'react']
  }
  }
  }
  ]
},
  devServer: {   
  historyApiFallback: true,
    contentBase: './'
  },
plugins: [HtmlWebpackPluginConfig]
}


А этот, который не создаёт финального дистрибутива:

Код:
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const PreloadWebpackPlugin = require('preload-webpack-plugin');
const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin');
const StyleExtHtmlWebpackPlugin = require('style-ext-html-webpack-plugin');
const CompressionPlugin = require('compression-webpack-plugin');
const autoprefixer = require('autoprefixer');

const staticSourcePath = path.join(__dirname, 'static');
const sourcePath = path.join(__dirname);
const buildPath = path.join(__dirname, 'dist');

module.exports = {
  devtool: 'cheap-module-source-map',
  entry: {
  /*base: path.resolve(staticSourcePath, 'src/sass/base.scss'),*/
  app: path.resolve(sourcePath, 'index.js')
  },
  output: {
  path: path.join(__dirname, 'dist'),
  filename: '[name].[chunkhash].js',
  publicPath: '/'
  },
  resolve: {
  extensions: ['.webpack-loader.js', '.web-loader.js', '.loader.js', '.js', '.jsx'],
  modules: [
  sourcePath,
  path.resolve(__dirname, 'node_modules')
  ]
  },
  plugins: [
  new webpack.DefinePlugin({
  'process.env.NODE_ENV': JSON.stringify('production')
  }),
  new webpack.optimize.ModuleConcatenationPlugin(),
  new webpack.optimize.CommonsChunkPlugin({
  name: 'vendor',
  filename: 'vendor.[chunkhash].js',
  minChunks (module) {
  return module.context && module.context.indexOf('node_modules') >= 0;
  }
  }),
  /*  new webpack.optimize.UglifyJsPlugin({
  compress: {
  warnings: false,
  screw_ie8: true,
  conditionals: true,
  unused: true,
  comparisons: true,
  sequences: true,
  dead_code: true,
  evaluate: true,
  if_return: true,
  join_vars: true
  },
  output: {
  comments: false
  }
  }),*/
  new webpack.LoaderOptionsPlugin({
  options: {
  postcss: [
  autoprefixer({
  browsers: [
  'last 3 version',
  'ie >= 10'
  ]
  })
  ],
  context: staticSourcePath
  }
  }),
  new webpack.HashedModuleIdsPlugin(),
  new HtmlWebpackPlugin({
  template: path.join(__dirname, 'index.html'),
  path: buildPath,
  excludeChunks: ['base'],
  filename: 'index.html',
  minify: {
  collapseWhitespace: true,
  collapseInlineTagWhitespace: true,
  removeComments: true,
  removeRedundantAttributes: true
  }
  }),
  new PreloadWebpackPlugin({
  rel: 'preload',
  as: 'script',
  include: 'all',
  fileBlacklist: [/\.(css|map)$/, /base?.+/]
  }),
  new ScriptExtHtmlWebpackPlugin({
  defaultAttribute: 'defer'
  }),
  new ExtractTextPlugin({
  filename: '[name].[contenthash].css',
  allChunks: true
  }),
  /* new StyleExtHtmlWebpackPlugin({
  minify: true
  }),*/
  new CompressionPlugin({
  asset: '[path].gz[query]',
  algorithm: 'gzip',
  test: /\.js$|\.css$|\.html$|\.eot?.+$|\.ttf?.+$|\.woff?.+$|\.svg?.+$/,
  threshold: 10240,
  minRatio: 0.8
  })
  ],
  module: {
   

   
  rules: [
  {
  test: /\.(js|jsx)$/,
  exclude: /node_modules/,
         use: {
          loader: 'babel-loader',
          options: {
           presets: ['env', 'react']
          }
         },
  include: sourcePath
  },
  {
  test: /\.scss$/,
  exclude: /node_modules/,
  use: ExtractTextPlugin.extract({
  fallback: 'style-loader',
  use: [
  { loader: 'css-loader', options: { minimize: true } },
  'postcss-loader',
  'sass-loader'
  ]
  })
  },
  {
  test: /\.(eot?.+|svg?.+|ttf?.+|otf?.+|woff?.+|woff2?.+)$/,
  use: 'file-loader?name=assets/[name]-[hash].[ext]'
  },
  {
  test: /\.(png|gif|jpg|svg)$/,
  use: [
  'url-loader?limit=20480&name=assets/[name]-[hash].[ext]'
  ],
  include: staticSourcePath
  }
  ]
  }
};

Всё вертится на Windows. Проект находится в корневой папке диска: D:\имя_проекта
Папка dist так же создана.

P.S. всё решилось штатно с помощью
Код:
webpack -p
 
Последнее редактирование:
Назад
Сверху