webpack.config.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. const path = require('path');
  2. const HtmlWebpackPlugin = require('html-webpack-plugin');
  3. const CleanWebpackPlugin = require("clean-webpack-plugin");
  4. const ExtractTextPlugin = require('extract-text-webpack-plugin');
  5. const autoprefixer = require('autoprefixer');
  6. const outputDirectory = "build";
  7. module.exports = {
  8. entry: './src/index.js',
  9. output: {
  10. library: 'Branding',
  11. path: path.resolve(__dirname, outputDirectory),
  12. filename: 'index.js',
  13. libraryTarget: 'umd',
  14. libraryExport: 'default'
  15. },
  16. devtool: 'source-map',
  17. module: {
  18. rules: [
  19. {
  20. test: /\.jsx?$/,
  21. exclude: /node_modules/,
  22. use: [
  23. {
  24. loader: 'babel-loader',
  25. options: {
  26. presets: ['react']
  27. }
  28. }
  29. ]
  30. },
  31. {
  32. test: /\.(sa|sc|c)ss$/,
  33. use: ExtractTextPlugin.extract({
  34. fallback: 'style-loader',
  35. use: [
  36. {
  37. loader: "css-loader",
  38. options: {
  39. sourceMap: true
  40. }
  41. },
  42. {
  43. loader: 'postcss-loader',
  44. options: {
  45. plugins: [
  46. autoprefixer({
  47. Browserslist: [
  48. '>1%',
  49. 'last 4 versions',
  50. 'Firefox ESR',
  51. 'not ie < 9', // React doesn't support IE8 anyway
  52. ]
  53. })
  54. ],
  55. sourceMap: true
  56. }
  57. },
  58. {
  59. loader: "sass-loader",
  60. options: {
  61. sourceMap: true
  62. }
  63. }
  64. ]
  65. })
  66. },
  67. {
  68. test: /\.(cur|ico|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,
  69. use: {
  70. loader: 'file-loader',
  71. query: {
  72. name: '[name].[hash:8].[ext]',
  73. outputPath: './assets/media/',
  74. publicPath: '/'
  75. }
  76. }
  77. },
  78. {
  79. test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
  80. use: {
  81. loader: 'url-loader',
  82. query: {
  83. limit: 10000,
  84. name: '[name].[hash:8].[ext]',
  85. outputPath: './assets/media/',
  86. publicPath: '/'
  87. }
  88. }
  89. }
  90. ]
  91. },
  92. plugins: [
  93. new CleanWebpackPlugin([outputDirectory]),
  94. new ExtractTextPlugin({
  95. filename: 'assets/css/[name].[contenthash:8].css'
  96. }),
  97. ]
  98. };