webpack.config copy.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. const path=require('path');
  2. const { CleanWebpackPlugin } = require('clean-webpack-plugin');
  3. //const { HtmlWebpackPlugin } = require("html-webpack-plugin");
  4. const HtmlWebpackPlugin = require('html-webpack-plugin');
  5. //const { VueLoaderPlugin } = require('vue-loader/dist/index');
  6. const { VueLoaderPlugin } = require('vue-loader');
  7. module.exports={
  8. entry:{
  9. index:"./index.js",
  10. sample:"./utils/sample.js",
  11. },
  12. output:{
  13. filename:"[name].js",
  14. path:path.resolve(__dirname,"./dist"),
  15. assetModuleFilename:"media/[name].[ext]",
  16. // publicPath: '/', // 静态资源公共路径
  17. // clean: true // 构建前清空 dist 目录
  18. },
  19. resolve: {
  20. alias: {
  21. vue: 'vue/dist/vue.esm-bundler.js' // 关键配置
  22. }
  23. },
  24. module:{
  25. rules:[
  26. {
  27. test:/\.css$/i,
  28. use:["style-loader","css-loader"]
  29. },
  30. {
  31. test:/\.vue$/,
  32. use:[
  33. { loader:"vue-loader" }
  34. ]
  35. },
  36. // 处理 .js 文件
  37. {
  38. test: /\.js$/,
  39. exclude: /node_modules/,
  40. use: {
  41. loader: 'babel-loader',
  42. options: {
  43. presets: ['@babel/preset-env']
  44. }
  45. }
  46. },
  47. {
  48. test:/\.(png|jpe?g|gif|svg)$/i,
  49. // use:[{
  50. // loader:"file-loader",
  51. // options:{
  52. // limit: 512 * 1024,
  53. // name: "[name].[ext]",
  54. // outputPath:"media",
  55. // },
  56. // }]
  57. type: 'asset/resource',
  58. // generator:{
  59. // filename: "[name].[ext]",
  60. // }
  61. },
  62. {
  63. test:/\.(woff2?|eof|ttf)$/i,
  64. // use:[{
  65. // loader:"file-loader",
  66. // options:{
  67. // limit: 512 * 1024,
  68. // name: "[name].[ext]",
  69. // outputPath:"media",
  70. // },
  71. // }]
  72. type: 'asset/resource',
  73. generator:{
  74. filename: "./font/[name].[ext]",
  75. }
  76. },]
  77. },
  78. plugins:[
  79. new VueLoaderPlugin(),
  80. new CleanWebpackPlugin(),
  81. new HtmlWebpackPlugin({
  82. inject:'head',
  83. title:"index page ",
  84. template:"./index.html",
  85. filename:"index.html",
  86. chunks:['index'],
  87. }),
  88. new HtmlWebpackPlugin({
  89. inject:'body',
  90. title:"sample page",
  91. template:"./pages/sample.html",
  92. filename:"sample.html",
  93. chunks:['sample'],
  94. }),
  95. ],
  96. // // 优化配置(如代码拆分)
  97. // optimization: {
  98. // splitChunks: {
  99. // chunks: 'all',
  100. // minSize: 20000,
  101. // cacheGroups: {
  102. // vendors: {
  103. // test: /[\\/]node_modules[\\/]/,
  104. // priority: -10,
  105. // reuseExistingChunk: true,
  106. // name: 'vendors'
  107. // }
  108. // }
  109. // }
  110. // }
  111. }