10 Webpack-Interviewfragen, wie viele können Sie beantworten?

In diesem Artikel werden Ihnen 10 Interviewfragen zu Webpack vorgestellt. Suchen Sie nach Lücken und füllen Sie diese aus. Wie viele dieser zehn Interviewfragen können Sie richtig beantworten? Können Sie sie alle richtig verstehen?

Die Interviewfragen sind nur eine Einführung Um die Fragen schnell aufzufrischen, merken Sie sich diese einfach (der Interviewer wird Sie fragen, aber er ist möglicherweise nicht sehr ausführlich). code>Wenn Sie tiefgreifend verstehen möchten, müssen Sie immer noch viel Energie aufwenden code>；快速刷题就是背（面试官问你，但是他不一定很深入），想深入理解还是得花大量精力；

webpack 的构建流程是什么

• 初始化参数：解析webpack配置参数，合并shell传入和webpack.config.js文件配置的参数,形成最后的配置结果；

• 开始编译：上一步得到的参数初始化compiler对象，注册所有配置的插件，插件 监听webpack构建生命周期的事件节点，做出相应的反应，执行对象的run方法开始执行编译；

• 确定入口：从配置的entry入口，开始解析文件构建AST语法树，找出依赖，递归下去；

• 编译模块：递归中根据文件类型和loader配置，调用所有配置的loader对文件进行转换，再找出该模块依赖的模块，再递归本步骤直到所有入口依赖的文件都经过了本步骤的处理；

• 完成模块编译并输出：递归完事后，得到每个文件结果，包含每个模块以及他们之间的依赖关系，根据entry或分包配置生成代码块chunk;

• 输出完成：输出所有的chunk到文件系统；

webpack 的热更新原理

其实是自己开启了express应用，添加了对webpack编译的监听，添加了和浏览器的websocket长连接，当文件变化触发webpack进行编译并完成后，会通过sokcet消息告诉浏览器准备刷新。而为了减少刷新的代价，就是不用刷新网页，而是刷新某个模块，webpack-dev-server可以支持热更新，通过生成 文件的hash值来比对需要更新的模块，浏览器再进行热替换

服务端

• 启动 webpack-dev-server服务器
• 创建webpack实例
• 创建server服务器
• 添加webpack的done事件回调
• 编译完成向客户端发送消息
• 创建express应用app
• 设置文件系统为内存文件系统
• 添加 webpack-dev-middleware 中间件
• 中间件负责返回生成的文件
• 启动webpack编译
• 创建http服务器并启动服务
• 使用sockjs在浏览器端和服务端之间建立一个websocket长连接
• 创建socket服务器

客户端

• webpack-dev-server/client端会监听到此hash消息
• 客户端收到ok消息后会执行reloadApp方法进行更新
• 在reloadApp中会进行判断，是否支持热更新，如果支持的话发生 webpackHotUpdate事件，如果不支持就直接刷新浏览器
• 在 webpack/hot/dev-server.js 会监听 webpackHotUpdate 事件
• 在check方法里会调用module.hot.check方法
• HotModuleReplacement.runtime请求Manifest
• 通过调用 JsonpMainTemplate.runtime 的 hotDownloadManifest方法
• 调用JsonpMainTemplate.runtime的hotDownloadUpdateChunk方法通过JSONP请求获取最新的模块代码
• 补丁js取回来或会调用 JsonpMainTemplate.runtime.js 的 webpackHotUpdate 方法
• 然后会调用 HotModuleReplacement.runtime.js 的 hotAddUpdateChunk方法动态更新 模块代码
• 然后调用hotApply方法进行热更

webpack 打包是hash码是如何生成的

1、webpack生态中存在多种计算hash的方式

• hash
• chunkhash
• contenthash

  Was ist der Konstruktionsprozess von Webpack? strong>

  • Initialisierungsparameter: Analysieren Sie die Webpack-Konfigurationsparameter, führen Sie die von der Shell übergebenen und in der Datei webpack.config.js konfigurierten Parameter zusammen, um die zu bilden Endgültiges Konfigurationsergebnis;

• Kompilierung starten: Initialisieren Sie das Compilerobjekt mit den im vorherigen Schritt erhaltenen Parametern, registrieren Sie alle konfigurierten Plug-Ins, das Plug-In lauscht auf die Ereignisknoten von Der Webpack-Build-Lebenszyklus reagiert entsprechend und führt die Ausführungsmethode des Objekts aus, um die Kompilierung zu starten AST-Syntaxbaum, ermitteln Sie die Abhängigkeiten und gehen Sie rekursiv vor;

• 🎜Kompilierungsmodul: Bei der Rekursion werden alle konfigurierten Loader-Paare entsprechend dem Dateityp und der Loader-Konfiguration aufgerufen Finden Sie dann die Module heraus, von denen das Modul abhängt, und wiederholen Sie dann diesen Schritt, bis alle eintragsabhängigen Dateien durch diesen Schritt verarbeitet wurden. 🎜🎜
• 🎜Modulkompilierung und -ausgabe abschließen : Nach Abschluss der Rekursion wird jedes Dateiergebnis erhalten, einschließlich jedes Moduls und der Abhängigkeiten zwischen ihnen, und der Codeblockblock wird entsprechend der Eintrags- oder Unterauftragskonfiguration generiert 🎜🎜
• 🎜Ausgabe abgeschlossen; code>: Ausgabe Alle Chunks werden in das Dateisystem übertragen; 🎜🎜🎜<h2 data-id="heading-2"><strong>Webpack-Hot-Update-Prinzip</strong></h2>🎜Tatsächlich <code>Öffnet die Express-Anwendung, fügt die Überwachung der Webpack-Kompilierung hinzu und fügt eine lange Websocket-Verbindung mit dem Browser hinzu. Wenn Dateiänderungen das Kompilieren und Abschließen des Webpacks auslösen, teilt <code> dem Browser mit, dass er sich über Sokcet-Nachrichten auf die Aktualisierung vorbereiten soll . Um die Kosten für die Aktualisierung zu senken, muss die Webseite nicht aktualisieren, aber aktualisiert ein Modul kann Hot-Updates durch Generieren des Hashs unterstützen Wert der Datei. Vergleichen Sie die Module, die aktualisiert werden müssen, und führen Sie dann einen Hot-Ersatz im Browser durch🎜🎜Server🎜
  • Starten Sie den Webpack-Dev-Server-Server🎜
  • Erstellen Sie eine Webpack-Instanz🎜
  • Erstellen Sie einen Server-Server🎜
  • Fügen Sie den Rückruf für das erledigte Ereignis des Webpacks hinzu🎜
  • Senden Sie eine Nachricht an den Client, nachdem die Kompilierung abgeschlossen ist🎜
  • Erstellen Sie eine Express-Anwendungs-App🎜
  • Legen Sie die Datei fest System zum Speicherdateisystem hinzufügen🎜
  • Webpack-dev -Middleware-Middleware hinzufügen🎜
  • Middleware ist für die Rückgabe der generierten Datei verantwortlich🎜
  • Webpack-Kompilierung starten🎜
  • Erstellen Sie einen http-Server und starten Sie den Dienst🎜Verwenden Sie sockjs, um einen Websocket zwischen dem Browser und dem Server einzurichten. Lange Verbindung🎜
  • Erstellen Sie einen Socket-Server🎜🎜🎜Client🎜
    • webpack-dev-server/client wird Hören Sie sich diese Hash-Nachricht an🎜
    • Der Client empfängt sie. Nach der OK-Nachricht wird die reloadApp-Methode zum Aktualisieren ausgeführt🎜
    • In reloadApp wird beurteilt, ob ein Hot-Update unterstützt wird, das WebpackHotUpdate Ereignis auftritt. Wenn es nicht unterstützt wird, wird der Browser direkt aktualisiert🎜
    • In webpack/hot/dev hört -server.js das webpackHotUpdate-Ereignis ab🎜
    • Die Methode module.hot.check wird aufgerufen in der Prüfmethode🎜
    • HotModuleReplacement.runtime fordert Manifest an🎜
    • Wird durch Aufruf der hotDownloadManifest-Methode von JsonpMainTemplate.runtime aufgerufen🎜
    • Die hotDownloadUpdateChunk-Methode von JsonpMainTemplate.runtime ruft den neuesten Modulcode über eine JSONP-Anfrage ab🎜
    • Der Patch js wird abgerufen oder die webpackHotUpdate-Methode von JsonpMainTemplate.runtime.js wird aufgerufen🎜
    • Dann wird die hotAddUpdateChunk-Methode von HotModuleReplacement.runtime.js für dynamisches Update-Modulcode aufgerufen🎜
    • Anschließend wird die hotApply-Methode für Hot-Update aufgerufen 🎜🎜

      Durch die Webpack-Verpackung wird der Hash-Code generiert

      🎜1 Es gibt viele Möglichkeiten, Hash im Webpack-Ökosystem zu berechnen 🎜
    • hash🎜
    • chunkhash🎜
    • contenthash 🎜 🎜🎜hash stellt den Hashwert dar, der bei jeder Webpack-Kompilierung generiert wird . Alle Dateien, die diese Methode verwenden, haben den gleichen Hash. Bei jedem Build berechnet das Webpack einen neuen Hash. Chunkhash wird basierend auf der Eintragsdatei und dem zugehörigen Block gebildet. Änderungen an einer bestimmten Datei wirken sich nur auf den Hash-Wert des damit verbundenen Blocks aus, haben jedoch keinen Einfluss auf die Content-Hash-Erstellung anderer Dateien basierend auf dem Dateiinhalt. Wenn sich der Dateiinhalt ändert, ändert sich auch der Inhaltshash🎜🎜2. Vermeiden Sie denselben Zufallswert🎜
      • webpack teilt den Block
  auf, nachdem der Hash berechnet wurde. <code>Derselbe Zufallswert kann generiert werden, da diese Dateien zum selben Block gehören. Sie können eine Datei einem unabhängigen Block hinzufügen (z. B. indem Sie sie in einen Eintrag einfügen)

So implementieren Sie das Webpack-Offline-Caching statischer Ressourcen计算hash后分割chunk。产生相同随机值可能是因为这些文件属于同一个chunk,可以将某个文件提到独立的chunk（如放入entry）

webpack 离线缓存静态资源如何实现

• 在配置webpack时，我们可以使用html-webpack-plugin来注入到和html一段脚本来实现将第三方或者共用资源进行 静态化存储在html中注入一段标识，例如 ac601a84bdd9ec7b81aa524a2e2a51dc ,在 html-webpack-plugin 中即可通过配置html属性，将script注入进去
• 利用 webpack-manifest-plugin 并通过配置 webpack-manifest-plugin ,生成 manifestjson 文件，用来对比js资源的差异，做到是否替换，当然，也要写缓存script
• 在我们做Cl以及CD的时候，也可以通过编辑文件流来实现静态化脚本的注入，来降低服务器的压力，提高性能
• 可以通过自定义plugin或者html-webpack-plugin等周期函数，动态注入前端静态化存储script

webpack 常见的plugin有哪些

• ProvidePlugin：自动加载模块，代替require和import
• html-webpack-plugin可以根据模板自动生成html代码，并自动引用css和js文件
• extract-text-webpack-plugin 将js文件中引用的样式单独抽离成css文件
• DefinePlugin 编译时配置全局变量，这对开发模式和发布模式的构建允许不同的行为非常有用。
• HotModuleReplacementPlugin 热更新
• optimize-css-assets-webpack-plugin 不同组件中重复的css可以快速去重
• webpack-bundle-analyzer 一个webpack的bundle文件分析工具，将bundle文件以可交互缩放的treemap的形式展示。
• compression-webpack-plugin 生产环境可采用gzip压缩JS和CSS
• happypack：通过多进程模型，来加速代码构建
• clean-wenpack-plugin 清理每次打包下没有使用的文件
• speed-measure-webpack-plugin:可以看至U每个Loader和Plugin执行耗时（整个扌丁包耗时、每个Plugin和 Loader 耗时）
• webpack-bundle-analyzer:可视化Webpack输出文件的体积（业务组件、依赖第三方模块

webpack 插件如何实现

• webpack本质是一个事件流机制，核心模块：tabable(Sync + Async)Hooks 构造出 === Compiler(编译) + Compiletion(创建bundles)
• compiler对象代表了完整的webpack环境配置。这个对象在启动webpack时被一次性建立，并配置好所有可操作的设置，包括options、loader和plugin。当在webpack环境中应用一插件时，插件将收到此compiler对象的引用。可以使用它来访问webpack的主环境
• compilation对象代表了一次资源版本构建。当运行webpack开发环境中间件时，每当检测到一个文件变化，就会创建一个新的compilation,从而生成一个新的编译资源。一个compilation对象表现了当前的模块资源、编译生成资源、变化的文件、以及被跟踪依赖的状态的信息。compilation对象也提供了很多关键时机的回调，以供插件做自定义处理时选择使用
• 创建一个插件函数，在其prototype上定义apply方法，指定一个webpack自身的事件钩子
• 函数内部处理webpack内部实例的特定数据
• 处理完成后，调用webpack提供的回调函数

function MyWebpackPlugin()(
}；
// prototype 上定义 apply 方法
MyWebpackPlugin.prototype.apply=function(){
// 指定一个事件函数挂载到webpack
compiler.pluginCwebpacksEventHook"funcion (compiler)( console. log(“这是一个插件”)；
// 功能完成调用后webpack提供的回调函数
callback()
})

webpack有哪些常用的Loader

• file-loader：把文件输出到⼀个文件夹中，在代码中通过相对 URL 去引⽤输出的⽂件
• url-loader：和 file-loader 类似，但是能在⽂件很⼩的情况下以 base64 的⽅式把⽂件内容注⼊到代码中去
• source-map-loader：加载额外的 Source Map ⽂件，以⽅便断点调试
• image-loader：加载并且压缩图⽚⽂件
• babel-loader：把 ES6 转换成 ES5
• css-loader：加载 CSS，⽀持模块化、压缩、⽂件导⼊等特性
• style-loader🎜Bei der Konfiguration von Webpack können wir das HTML-Webpack-Plugin verwenden, um ein Skript einzufügen HTML zur Implementierung Drittanbieter- oder freigegebene Ressourcen werden statisch gespeichert, indem ein Tag in HTML eingefügt wird, z. B. ac601a84bdd9ec7b81aa524a2e2a51dc. Sie können HTML in HTML-Webpack konfigurieren -plugin. Attribut, fügen Sie das Skript ein
🎜Verwenden Sie webpack-manifest-plugin und konfigurieren Sie webpack-manifest-plugin, um eine Manifestjson-Datei zu generieren, um die Unterschiede in den js-Ressourcen zu vergleichen und zu entscheiden, ob sie ersetzt werden sollen. Sie müssen auch ein Cache-Skript schreiben. 🎜Wenn wir Cl und CD machen, können wir auch statische Skripte einfügen, indem wir den Dateistream bearbeiten, um den Druck auf den Server zu verringern und die Leistung zu verbessern.🎜Wir können das anpassen Plugin oder HTML-Webpack -Plugin und andere periodische Funktionen, dynamisches Einfügen von statischen Front-End-Speicherskripten

Was sind die gängigen Plugins in Webpack?

🎜🎜ProvidePlugin: Module automatisch laden, Anforderungen ersetzen und importieren🎜html-webpack-plugin kann automatisch HTML-Code generieren auf Vorlagen und verweisen automatisch auf CSS- und JS-Dateien🎜extract-text-webpack-plugin Extrahieren Sie die in der JS-Datei referenzierten Stile in CSS-Dateien🎜DefinePlugin Konfigurieren Sie die globale Konfiguration zur Kompilierzeit. Variablen, die nützlich sind, um unterschiedliche Verhaltensweisen zwischen Builds im Entwicklungsmodus und im Release-Modus zu ermöglichen. 🎜<code>HotModuleReplacementPlugin Heißes Update🎜optimize-css-assets-webpack-plugin Doppeltes CSS in verschiedenen Komponenten kann schnell entfernt werden 🎜 webpack-bundle-analyzer Ein Tool zur Analyse von Webpack-Bundle-Dateien, das Bundle-Dateien in Form interaktiv zoombarer Baumkarten anzeigt. 🎜compression-webpack-plugin Die Produktionsumgebung kann gzip verwenden, um JS und CSS zu komprimieren🎜happypack: Beschleunigen Sie die Codekonstruktion durch einen Multiprozess model🎜clean-wenpack-plugin Bereinigt nicht verwendete Dateien in jedem Paket🎜speed-measure-webpack-plugin: Sie können jedes sehen Ausführungszeit jedes Loaders und Plugins (die Zeit des gesamten Pakets, die Zeit jedes Plugins und Loaders)🎜webpack-bundle-analyzer: Visualisieren Sie das Volumen der Webpack-Ausgabedateien (business Komponenten, basierend auf Modulen von Drittanbietern

So implementieren Sie das Webpack-Plug-in

🎜🎜webpack ist im Wesentlichen ein Ereignis-Streaming-Mechanismus: Tabable (Sync + Async) Hooks-Konstrukt === Compiler (Kompilierung) + Kompilierung (Bundles erstellen) 🎜Das Compiler-Objekt stellt die vollständige Webpack-Umgebungskonfiguration dar. Dieses Objekt wird erstellt Einmal beim Starten von Webpack und konfigurieren Sie alle Betriebseinstellungen, einschließlich Optionen, Loader und Plugin. Beim Anwenden eines Plug-Ins in der Webpack-Umgebung erhält das Plug-In einen Verweis auf dieses Compiler-Objekt und kann damit auf das Hauptobjekt zugreifen Umgebung von Webpack. 🎜Das Kompilierungsobjekt stellt einen Ressourcenversions-Build dar. Beim Ausführen der Webpack-Entwicklungsumgebungs-Middleware wird jedes Mal eine neue Kompilierung erstellt, wenn eine Dateiänderung erkannt wird, wodurch ein neues Kompilierungsobjekt generiert wird, das die aktuelle Kompilierungsressource darstellt . Modulressourcen, kompilierte Ressourcen, geänderte Dateien und Informationen zum Status der nachverfolgten Abhängigkeiten. Das Kompilierungsobjekt bietet auch viele wichtige Timing-Rückrufe, die das Plug-in bei der benutzerdefinierten Verarbeitung auswählen kann.🎜Erstellen Sie eine Plug-in-Funktion . Definieren Sie die Apply-Methode für ihren Prototyp und geben Sie einen Ereignis-Hook des Webpacks selbst an🎜Die Funktion verarbeitet intern die spezifischen Daten der internen Instanz des Webpacks🎜Nachdem die Verarbeitung abgeschlossen ist, rufen Sie die Rückruffunktion auf bereitgestellt von Webpackrrreee

Was sind die am häufigsten verwendeten Loader in Webpack

🎜🎜file- Loader: Geben Sie die Datei in einem Ordner aus. Verweisen Sie über eine relative URL im Code auf die Ausgabedatei.🎜url-loader: Ähnlich wie File-Loader, kann es aber sein Wird verwendet, wenn die Datei sehr klein ist. Fügen Sie als Nächstes den Dateiinhalt im Base64-Format in den Code ein🎜source-map-loader: Laden Sie zusätzliche Source Map-Dateien, um das Debuggen von Haltepunkten zu erleichtern li>🎜image-loader: Bilddateien laden und komprimieren🎜babel-loader: ES6 in ES5 konvertieren🎜 css-loader : CSS laden, Modularisierung, Komprimierung, Dateiimport und andere Funktionen unterstützen🎜style-loader: CSS-Code durch DOM-Manipulation in JavaScript einfügen, um CSS zu laden.

eslint-loader: JavaScript-Code über ESLint prüfeneslint-loader：通过 ESLint 检查 JavaScript 代码

webpack如何实现持久化缓存

• 服务端设置http缓存头（cache-control）
• 打包依赖和运行时到不同的chunk，即作为splitChunk,因为他们几乎是不变的
• 延迟加载：使用import()方式，可以动态加载的文件分到独立的chunk,以得到自己的chunkhash
• 保持hash值的稳定：编译过程和文件内通的更改尽量不影响其他文件hash的计算，对于低版本webpack生成的增量数字id不稳定问题，可用hashedModuleIdsPlugin基于文件路径生成解决

如何webpack来优化前端性能？

⽤webpack优化前端性能是指优化webpack的输出结果，让打包的最终结果在浏览器运⾏快速⾼效。

• 压缩代码：删除多余的代码、注释、简化代码的写法等等⽅式。可以利⽤webpack的 UglifyJsPlugin 和 ParallelUglifyPlugin 来压缩JS件， 利⽤ cssnano （css-loader?minimize）来压缩css
• 利⽤CDN加速: 在构建过程中，将引⽤的静态资源路径修改为CDN上对应的路径。可以利⽤webpack对于 output 参数和各loader的 publicPath 参数来修改资源路径
• Tree Shaking: 将代码中永远不会⾛到的⽚段删除掉。可以通过在启动webpack时追加参数 --optimize-minimize 来实现
• Code Splitting: 将代码按路由维度或者组件分块(chunk),这样做到按需加载,同时可以充分利⽤浏览器缓存
• 提取公共第三⽅库: SplitChunksPlugin插件来进⾏公共模块抽取,利⽤浏览器缓存可以⻓期缓存这些⽆需频繁变动的公共代码

webpack treeShaking机制的原理

• treeShaking 也叫摇树优化，是一种通过移除多于代码，来优化打包体积的，生产环境默认开启。
• 可以在代码不运行的状态下，分析出不需要的代码；
• 利用es6模块的规范
  • ES6 Module引入进行静态分析，故而编译的时候正确判断到底加载了那些模块

  Wie Webpack persistentes Caching implementiert

  • Der Server legt den HTTP-Cache-Header fest (Cache-Kontrolle)
  Paketabhängigkeiten und Laufzeit in verschiedene Chunks, d. h. als splitChunk, weil sie nahezu unverändert sind

Lazy Loading: Mithilfe der import()-Methode können dynamisch geladene Dateien in unabhängige Blöcke aufgeteilt werden, um ihren eigenen Chunkhash zu erhalten.

Behalten Sie die Stabilität des Hash-Werts bei: Änderungen im Kompilierungsprozess und der Dateikommunikation sollten sich nicht auf die Berechnung von Hashes anderer Dateien auswirken. Für das instabile Problem inkrementeller digitaler IDs, die von niedrigeren Versionen des Webpacks generiert werden, kann das hashedModuleIdsPlugin verwendet werden, um das Problem zu lösen zur Dateipfadgenerierung

Wie optimiert man die Front-End-Leistung mit Webpack?

Die Verwendung von Webpack zur Optimierung der Front-End-Leistung bedeutet, die Ausgabeergebnisse von Webpack zu optimieren, sodass das endgültige gepackte Ergebnis schnell und effizient im Browser ausgeführt wird.

Code komprimieren: Löschen Sie redundanten Code, Kommentare, vereinfachen Sie das Schreiben von Code usw. Sie können UglifyJsPlugin und ParallelUglifyPlugin von Webpack verwenden, um JS-Dateien zu komprimieren, und cssnano (css-loader?minimize) verwenden, um CSS zu komprimierenCDN-Beschleunigung verwenden: Während des Erstellungsprozesses werden die referenzierten statischen Dateien komprimiert . Der Ressourcenpfad wird in den entsprechenden Pfad im CDN geändert. Sie können den Ausgabeparameter des Webpacks und den publicPath-Parameter jedes Loaders verwenden, um den Ressourcenpfad zu ändern

🎜Tree Shaking: Löschen Sie Segmente, die nie im Code zu sehen sind. Dies kann erreicht werden, indem beim Starten des Webpacks der Parameter --optimize-minimize angehängt wird vollständig geladen sein. 🎜🎜Öffentliche Bibliotheken von Drittanbietern extrahieren: SplitChunksPlugin zum Extrahieren öffentlicher Module Zeit🎜🎜Das Prinzip des Webpack-TreeShaking-Mechanismus
🎜treeShaking wird auch Tree-Shaking-Optimierung genannt . Abgesehen von mehr Code zur Optimierung des Verpackungsvolumens ist die Produktionsumgebung standardmäßig aktiviert. 🎜🎜Sie können den unnötigen Code analysieren, wenn der Code nicht ausgeführt wird. 🎜🎜Verwenden Sie die Spezifikationen des es6-Moduls
🎜 ES6 Das Modul führt die statische Analyse ein, sodass korrekt bestimmt, welche Module beim Kompilieren geladen werden🎜🎜den Programmablauf statisch analysiert, um festzustellen, welche Module und Variablen nicht verwendet oder referenziert werden corresponding code🎜🎜🎜🎜🎜🎜Original address: https://juejin.cn/post/7002839760792190989🎜🎜Author: Front-end_Maverick_to Rhino🎜🎜🎜Related tutorial recommendations: "🎜Webpack Getting Started Video Tutorial🎜" 🎜

Das obige ist der detaillierte Inhalt von10 Webpack-Interviewfragen, wie viele können Sie beantworten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!