webpack.config.js 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. const path = require('path');
  2. const HtmlWebpackPlugin = require('html-webpack-plugin');
  3. const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  4. const webpack = require('webpack');
  5. const proxyHost = "http://192.168.2.236:5050";
  6. module.exports = {
  7. entry:'./src/js/index.js',
  8. output:{
  9. filename: "main.js",
  10. path:path.resolve(__dirname, 'dist'),
  11. publicPath:'/'
  12. },
  13. mode:'development',
  14. devtool: 'inline-source-map',
  15. devServer: {
  16. contentBase: './dist',
  17. proxy:{
  18. '/api':proxyHost
  19. },
  20. hot: true
  21. },
  22. plugins: [
  23. new HtmlWebpackPlugin({
  24. title: '11111',
  25. template:'./src/index.html',
  26. filename:'index.html'
  27. }),
  28. new HtmlWebpackPlugin({
  29. title: 'test',
  30. template:'./src/test.html',
  31. filename:'test.html'
  32. }),
  33. new MiniCssExtractPlugin({
  34. // Options similar to the same options in webpackOptions.output
  35. // both options are optional
  36. filename: '[name].css',
  37. chunkFilename: '[id].css',
  38. }),
  39. ],
  40. module: {
  41. rules: [
  42. {
  43. test: /\.js$/,
  44. use: "imports-loader?$=jquery"
  45. },
  46. {
  47. test: /\.css$/,
  48. use: [
  49. {
  50. loader: MiniCssExtractPlugin.loader,
  51. options: {
  52. // you can specify a publicPath here
  53. // by default it uses publicPath in webpackOptions.output
  54. },
  55. },
  56. 'css-loader',
  57. ],
  58. },
  59. {
  60. test:/\.less$/,
  61. use:['style-loader','css-loader','less-loader']
  62. },
  63. {
  64. test: /\.(png|svg|jpg|gif)$/,
  65. use: [
  66. 'file-loader'
  67. ]
  68. }
  69. ]
  70. }
  71. }