webpack.config.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. const path = require('path');
  2. const webpack = require('webpack')
  3. const HtmlWebpackPlugin = require('html-webpack-plugin');
  4. const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
  5. const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
  6. const { DEV, DEBUG } = process.env;
  7. process.env.BABEL_ENV = DEV ? 'development' : 'production';
  8. process.env.NODE_ENV = DEV ? 'development' : 'production';
  9. module.exports = {
  10. entry: './src/index.tsx',
  11. output: {
  12. path: path.join(__dirname, '/public'),
  13. filename: 'bundle.js'
  14. },
  15. devServer: {
  16. port: 8080,
  17. client: {
  18. logging: 'error',
  19. progress: true,
  20. overlay: true,
  21. webSocketURL: {
  22. hostname: 'dev.joystreamstats.live',
  23. pathname: '/ws',
  24. port: 443,
  25. protocol: 'wss'
  26. }
  27. }
  28. },
  29. module: {
  30. rules: [
  31. {
  32. test: /\.(js|jsx)$/,
  33. exclude: /node_modules/,
  34. type: 'javascript/auto',
  35. },
  36. {
  37. test: /\.tsx?$/,
  38. use: [
  39. {
  40. loader: 'ts-loader',
  41. options: {
  42. transpileOnly: true,
  43. },
  44. },
  45. ],
  46. exclude: [/node_modules/],
  47. },
  48. {
  49. test: /\.css$/,
  50. use: [ 'style-loader', 'css-loader' ],
  51. },
  52. {
  53. test: /\.(png|jpg|gif|woff|woff2|eot|ttf|otf|svg)$/,
  54. exclude: /node_modules/,
  55. use: ['file-loader'],
  56. },
  57. {
  58. test: /\.md$/,
  59. use: 'raw-loader',
  60. },
  61. {
  62. test: /\.(less)$/,
  63. exclude: /\.module\.less$/,
  64. use: [
  65. {
  66. loader: 'css-loader',
  67. options: {
  68. importLoaders: 2,
  69. sourceMap: !!DEV,
  70. },
  71. },
  72. {
  73. loader: 'less-loader',
  74. options: {
  75. sourceMap: !!DEV,
  76. },
  77. },
  78. ],
  79. },
  80. {
  81. test: /\.(sass|scss)$/,
  82. use: [
  83. {
  84. loader: 'css-loader',
  85. options: {
  86. importLoaders: 2,
  87. sourceMap: !!DEV,
  88. },
  89. },
  90. {
  91. loader: 'sass-loader',
  92. options: {
  93. sourceMap: !!DEV,
  94. },
  95. },
  96. ],
  97. },
  98. ]
  99. },
  100. resolve: {
  101. modules: ['node_modules'],
  102. extensions: [ '.tsx', '.ts', '.js', '.jsx'],
  103. fallback: {
  104. crypto: require.resolve('crypto-browserify'),
  105. stream: require.resolve('stream-browserify'),
  106. path: require.resolve("path-browserify"),
  107. fs: false,
  108. },
  109. plugins: [ new TsconfigPathsPlugin({ configFile: "./tsconfig.json" }) ]
  110. },
  111. plugins:[
  112. new HtmlWebpackPlugin({
  113. inject: false,
  114. template: path.resolve(__dirname, "public/index.html"),
  115. }),
  116. new webpack.ProvidePlugin({
  117. Buffer: ['buffer', 'Buffer'],
  118. process: 'process/browser.js',
  119. "React": "react",
  120. }),
  121. new NodePolyfillPlugin()
  122. ]
  123. }