Browse Source

add some reposity

night-cherry 3 weeks ago
parent
commit
13f99b91a9
3 changed files with 169 additions and 75 deletions
  1. 112 0
      backup/webpack.config copy.js
  2. 47 0
      backup/webpack.config.js
  3. 10 75
      webpack.config.js

+ 112 - 0
backup/webpack.config copy.js

@@ -0,0 +1,112 @@
+const path=require('path');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+//const { HtmlWebpackPlugin } = require("html-webpack-plugin");
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+//const { VueLoaderPlugin } = require('vue-loader/dist/index');
+const { VueLoaderPlugin } = require('vue-loader');
+
+module.exports={
+  entry:{
+    index:"./index.js",
+    sample:"./utils/sample.js",
+  },
+  output:{
+    filename:"[name].js",
+    path:path.resolve(__dirname,"./dist"),
+    assetModuleFilename:"media/[name].[ext]",
+    // publicPath: '/',  // 静态资源公共路径
+    // clean: true       // 构建前清空 dist 目录
+  },
+  resolve: {
+    alias: {
+      vue: 'vue/dist/vue.esm-bundler.js' // 关键配置
+    }
+  },
+  module:{
+    rules:[
+      {
+        test:/\.css$/i,
+        use:["style-loader","css-loader"]
+      },
+     {
+      test:/\.vue$/,
+      use:[
+        { loader:"vue-loader" }
+      ]
+    },
+      // 处理 .js 文件
+    {
+      test: /\.js$/,
+      exclude: /node_modules/,
+      use: {
+        loader: 'babel-loader',
+        // options: {
+        //   presets: ['@babel/preset-env']
+        // }
+      }
+    },
+    {
+     test:/\.(png|jpe?g|gif|svg)$/i,
+    //  use:[{ 
+    //   loader:"file-loader",
+    //   options:{
+    //     limit: 512 * 1024,
+    //     name: "[name].[ext]",
+    //     outputPath:"media",
+    //   },
+    //  }]
+      type: 'asset/resource',
+      // generator:{
+      //   filename: "[name].[ext]",
+      // }
+   },
+   {
+      test:/\.(woff2?|eof|ttf)$/i,
+    //  use:[{ 
+    //   loader:"file-loader",
+    //   options:{
+    //     limit: 512 * 1024,
+    //     name: "[name].[ext]",
+    //     outputPath:"media",
+    //   },
+    //  }]
+      type: 'asset/resource',
+      generator:{
+        filename: "./font/[name].[ext]",
+      }
+  },]
+  },
+  plugins:[
+    new VueLoaderPlugin(),
+    new CleanWebpackPlugin(),
+    new HtmlWebpackPlugin({
+      inject:'head',
+      title:"index page ",
+      template:"./index.html",
+      filename:"index.html",
+      chunks:['index'],
+    }),
+    new HtmlWebpackPlugin({
+      inject:'body',
+      title:"sample page",
+      template:"./pages/sample.html",
+      filename:"sample.html",
+      chunks:['sample'],
+    }),
+  ],
+  // // 优化配置(如代码拆分)
+  // optimization: {
+  //   splitChunks: {
+  //     chunks: 'all',
+  //     minSize: 20000,
+  //     cacheGroups: {
+  //       vendors: {
+  //         test: /[\\/]node_modules[\\/]/,
+  //         priority: -10,
+  //         reuseExistingChunk: true,
+  //         name: 'vendors'
+  //       }
+  //     }
+  //   }
+  // }
+}

+ 47 - 0
backup/webpack.config.js

@@ -0,0 +1,47 @@
+const path=require('path');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+//const { HtmlWebpackPlugin } = require("html-webpack-plugin");
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+//const { VueLoaderPlugin } = require('vue-loader/dist/index');
+const { VueLoaderPlugin } = require('vue-loader');
+
+module.exports={
+  entry:"./index.js",
+  output:{
+    filename:"bundle.js",
+    path:path.resolve(__dirname,"./dist")
+  },
+  resolve: {
+    alias: {
+      vue: 'vue/dist/vue.esm-bundler.js' // 关键配置
+    }
+  },
+  module:{
+    rules:[
+      {
+        test:/\.css$/i,
+        use:["style-loader","css-loader"]
+      },
+     {
+      test:/\.vue$/,
+      use:[
+        { loader:"vue-loader" }
+      ]
+    },
+      // 处理 .js 文件
+    {
+      test: /\.js$/,
+      loader: 'babel-loader',
+      exclude: /node_modules/
+    }]
+  },
+  plugins:[
+    new VueLoaderPlugin(),
+    new CleanWebpackPlugin(),
+    new HtmlWebpackPlugin({
+      inject:'body',
+      title:"webpack sample ",
+      template:"./index.html"
+    })
+  ]
+}

+ 10 - 75
webpack.config.js

@@ -6,16 +6,10 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 const { VueLoaderPlugin } = require('vue-loader');
 
 module.exports={
-  entry:{
-    index:"./index.js",
-    sample:"./utils/sample.js",
-  },
+  entry:"./index.js",
   output:{
-    filename:"[name].js",
-    path:path.resolve(__dirname,"./dist"),
-    assetModuleFilename:"media/[name].[ext]",
-    publicPath: '/',  // 静态资源公共路径
-    clean: true       // 构建前清空 dist 目录
+    filename:"bundle.js",
+    path:path.resolve(__dirname,"./dist")
   },
   resolve: {
     alias: {
@@ -37,76 +31,17 @@ module.exports={
       // 处理 .js 文件
     {
       test: /\.js$/,
-      exclude: /node_modules/,
-      use: {
-        loader: 'babel-loader',
-        // options: {
-        //   presets: ['@babel/preset-env']
-        // }
-      }
-    },
-    {
-     test:/\.(png|jpe?g|gif|svg)$/i,
-    //  use:[{ 
-    //   loader:"file-loader",
-    //   options:{
-    //     limit: 512 * 1024,
-    //     name: "[name].[ext]",
-    //     outputPath:"media",
-    //   },
-    //  }]
-      type: 'asset/resource',
-      // generator:{
-      //   filename: "[name].[ext]",
-      // }
-   },
-   {
-      test:/\.(woff2?|eof|ttf)$/i,
-    //  use:[{ 
-    //   loader:"file-loader",
-    //   options:{
-    //     limit: 512 * 1024,
-    //     name: "[name].[ext]",
-    //     outputPath:"media",
-    //   },
-    //  }]
-      type: 'asset/resource',
-      generator:{
-        filename: "./font/[name].[ext]",
-      }
-  },]
+      loader: 'babel-loader',
+      exclude: /node_modules/
+    }]
   },
   plugins:[
     new VueLoaderPlugin(),
     new CleanWebpackPlugin(),
     new HtmlWebpackPlugin({
-      inject:'head',
-      title:"index page ",
-      template:"./index.html",
-      filename:"index.html",
-      chunks:['index'],
-    }),
-    new HtmlWebpackPlugin({
       inject:'body',
-      title:"sample page",
-      template:"./pages/sample.html",
-      filename:"sample.html",
-      chunks:['sample'],
-    }),
-  ],
-  // // 优化配置(如代码拆分)
-  // optimization: {
-  //   splitChunks: {
-  //     chunks: 'all',
-  //     minSize: 20000,
-  //     cacheGroups: {
-  //       vendors: {
-  //         test: /[\\/]node_modules[\\/]/,
-  //         priority: -10,
-  //         reuseExistingChunk: true,
-  //         name: 'vendors'
-  //       }
-  //     }
-  //   }
-  // }
+      title:"webpack sample ",
+      template:"./index.html"
+    })
+  ]
 }