vor 3 Jahren · 67062f70bb
--- a/27/.gitignore
+++ b/27/.gitignore
@@ -0,0 +1 @@
 
				+build/
			
--- a/27/src/index.html
+++ b/27/src/index.html
@@ -0,0 +1,16 @@
 
				+<!DOCTYPE html>

			
 
				+<html lang="en">

			
 
				+<head>

			
 
				+    <meta charset="UTF-8">

			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge">

			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0">

			
 
				+    <title>Document</title>

			
 
				+    <script

			
 
				+  src="https://code.jquery.com/jquery-3.6.0.slim.min.js"

			
 
				+  integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI="

			
 
				+  crossorigin="anonymous"></script>

			
 
				+</head>

			
 
				+<body>

			
 
				+    <h1 id="title">hello</h1>

			
 
				+</body>

			
 
				+</html>
			
--- a/27/src/index.js
+++ b/27/src/index.js
@@ -0,0 +1,2 @@
 
				+import $ from 'jQuery'

			
 
				+console.log($)
			
--- a/27/webpack.config.js
+++ b/27/webpack.config.js
@@ -0,0 +1,32 @@
 
				+/**

			
 
				+ * loader: 1下载 2使用

			
 
				+ * plugins：1下载 2引入 3使用

			
 
				+ */

			
 
				+const {resolve} = require('path')

			
 
				+const htmlWebpackPlugin = require('html-webpack-plugin')

			
 
				+module.exports = {

			
 
				+    entry: './src/index.js',

			
 
				+    output:{

			
 
				+        filename: 'js/built.js',

			
 
				+        path: resolve(__dirname,'build')

			
 
				+    },

			
 
				+    module:{

			
 
				+        rules:[

			
 
				+

			
 
				+        ]

			
 
				+    },

			
 
				+    plugins:[

			
 
				+        // html-webpack-plugin

			
 
				+        // 默认创建一个空的html文件 自动引入打包输出的所有资源（js/css）

			
 
				+        // 需要有解构的html文件

			
 
				+        new htmlWebpackPlugin({

			
 
				+            // 复制该文件，并自动引入打包输出的所有资源

			
 
				+            template: './src/index.html'

			
 
				+        })

			
 
				+    ],

			
 
				+    mode:'production',

			
 
				+    externals:{

			
 
				+        //忽略 库名 -- 包名

			
 
				+        jquery: 'jQuery'

			
 
				+    }

			
 
				+}
			
--- a/README.md
+++ b/README.md
@@ -31,6 +31,7 @@ npx webpack serve
 
				 * 24: 懒加载和预加载

			
 
				 * 25：PWA 可离线访问 -- 缓存

			
 
				 * 26: 多进程打包

			
 
				+* 27：externals 

			
 
				 

			
 
				 ## 关于

			
 
				 用于学习webpack配置，包括css、less、图片资源、其他资源、开发环境等配置。