update fraction 20231215

article/_draft.md

@@ -1705,6 +1705,9 @@ KiB 和 KB 和 Kb 和 Kbps 的联系与区别
         程序 progrem
         进程 process
         线程 thread
+        协程 coroutine
+        异步 asynchronous
+        同步 synchronous
         文档 document
         数据 data
         配置 configuration

article/在Windows下安装Magento2.md

@@ -329,6 +329,10 @@
 - 如果 clone 速度太慢，可以在 releases 那里下载源码的压缩包（如果还是太慢就用一些下载工具来下载 releases 的压缩包）
 
 配置 vscode 的 xml 文件语法高亮
+1. vscode 里装上这个插件
+    ```
+    XML Language Support by Red Hat
+    ```
 1. 在项目根目录运行这句命令
     ```bash
     php bin/magento dev:urn-catalog:generate --ide vscode -- .vscode/misc.xml

article/在Windows下配置PHP服务器.md

@@ -7,10 +7,41 @@
 - apache 2.4
 - nginx 1.12
 - redis 3.2.1 (redis 的 windows 版已经很久没更新了，虽然还是能用)
-- git for windows 2.33 
+- git for windows 2.33
     - 虽然 git 和运行 php 没有关系，但用 composer 安装依赖时有些时候会直接从 github 里拉取代码，如果这时系统里没有安装 git 可能会报错
     - git 也要加到环境变量里（一般安装完后重启一次环境变量里就有 git 的了）
 
+<!--
+- elasticsearch 7.9.3
+- kibana 7.6.2
+
+从官网下载 elasticsearch
+下载完后解压
+运行这个文件就能运行 elasticsearch 了
+bin/elasticsearch.bat
+
+从官网下载 kibana
+下载完后解压
+运行这个文件就能运行 kibana 了
+bin/kibana.bat
+http://127.0.0.1:5601
+进入Kibana的DevTools界面操作ES
+
+要先运行 elasticsearch 后运行 kibana
+kibana 的版本要和 elasticsearch 对应，不然 kibana 运行不了
+如果运行失败要留意命令行的输出
+
+只要双方都是默认配置，那么就可以直接运行的了
+elasticsearch 的配置文件 config/elasticsearch.yml
+kibana 的配置文件 config/kibana.yml
+
+curl -v --user user:passwd 'http://localhost:9200/_cat/nodes?v'
+curl -v 'http://127.0.0.1:9200/_cat/nodes?v'
+curl -v 'http://127.0.0.1:9200'
+
+-->
+
+
 ## php
 
 ### 下载 php

article/开发Magento2的模块.md

@@ -1546,6 +1546,12 @@ php bin/magento cron:run --group=consumers
 di.xml
 
 <preference for="Magento\Banner\Model\Banner\Validator" type="LocalDev\HomeBanner\Model\Banner\Validator" />
+
+<preference for=“原始类或接口” type=“新的类” />
+
+preference 的优点是可以方便地修改或扩展已有的类或接口
+preference 的缺点是可能会导致类之间的冲突，因为一次只能有一个 preference 生效，除非你手动地让它们链式地继承
+
 -->
 
 ## 事件和观察者 (Events and Observers)
@@ -1841,10 +1847,10 @@ uiElement 继承自 uiClass
 uiClass 是普通的类
 uiElement 可以算是 knockoutjs 里的视图模型了
 
-uiElement:      'Magento_Ui/js/lib/core/element/element',
-uiCollection:   'Magento_Ui/js/lib/core/collection',
-uiComponent:    'Magento_Ui/js/lib/core/collection',
-uiClass:        'Magento_Ui/js/lib/core/class',
+uiElement:      'Magento_Ui/js/lib/core/element/element', vendor\magento\module-ui\view\base\web\js\lib\core\element\element.js
+uiCollection:   'Magento_Ui/js/lib/core/collection', vendor\magento\module-ui\view\base\web\js\lib\core\collection.js
+uiComponent:    'Magento_Ui/js/lib/core/collection', vendor\magento\module-ui\view\base\web\js\lib\core\collection.js
+uiClass:        'Magento_Ui/js/lib/core/class', vendor\magento\module-ui\view\base\web\js\lib\core\class.js
 
 uiRegistry
 vendor\magento\module-ui\view\base\web\js\lib\registry\registry.js
@@ -1854,18 +1860,66 @@ define 和 require 这两个函数是不一样的。。。
 
 requirejs 模块加载(require)及定义(define)
 
-
+underscore lib\web\underscore.js
 mageUtils   lib\web\mage\utils\main.js
 mage/utils/wrapper   lib\web\mage\utils\wrapper.js
 mage/translate lib\web\mage\utils\template.js
 
+uiEvents vendor\magento\module-ui\view\base\web\js\lib\core\events.js
+links vendor\magento\module-ui\view\base\web\js\lib\core\element\links.js
+uiRegistry vendor\magento\module-ui\view\base\web\js\lib\registry\registry.js
 
-uiClass 好像也是继承自 mageUtils 和 mage/utils/wrapper
+uiClass 好像也是继承自 underscore 
+uiClass 好像和 mageUtils 和 mage/utils/wrapper 密切相关
 而 mageUtils 和 mage/utils/wrapper 则是来自 underscore
 
+knockout lib\web\knockoutjs\knockout.js
+lib\web\requirejs\require.js
+
+要留意模块里的这个文件 requirejs-config.js
+
+这是另一个重要的 requirejs-config.js
+vendor\magento\module-theme\view\base\requirejs-config.js
+
+会把各个主题和模块里的 requirejs-config.js 文件合并成一个单独的 requirejs-config.js
+
+在加载 lib\web\requirejs\require.js 之前，会有这一段 js 是用来指示 js 的加载路径的
+<script>
+var BASE_URL = 'https\u003A\u002F\u002Fshop\u002Ddev.theclub.com.hk\u002F';
+var require = {
+    'baseUrl': 'https\u003A\u002F\u002Fshop\u002Ddev.theclub.com.hk\u002Fstatic\u002Fversion1669169968\u002Ffrontend\u002FHKT\u002Fstandard\u002Fen_US'
+};
+</script>
+
+这是第一个引入的 js 文件
+lib\web\requirejs\require.js
+pub\static\frontend\HKT\standard\en_US\requirejs\require.js
+
+
+mage 开头的前端文件 是来自这个文件夹的
+lib\web\mage
+
+mageUtils   lib\web\mage\utils\main.js
+mage/utils/wrapper   lib\web\mage\utils\wrapper.js
+mage/translate lib\web\mage\utils\template.js
+
 
 knockoutjs 这个的视图是怎么实现的？
 
+如果开了生产模式，且完成构建后，这个才是页面第一个加载的js，这是一个经过合并的js文件
+这个js会加载 requirejs 和 一些 config ，然后又会加载一些 公共的模块，像 jq 这些
+https://magento.local/static/version1702444490/_cache/merged/bb6ac75328fcb226b1c39f8031afeb03.min.js
+总而言之 requirejs 是第一个加载的 js 库
+
+
+每个component都有自己独立的template，knockoutjs会把template动态渲染到页面上。
+但也由于是动态异步渲染，template的元素渲染完成的时间很难掌握，想用jquery操作渲染完成后的DOM就成了难题。
+knockoutjs并不鼓励用jquery操作它渲染出来的DOM，但丰富的jquery插件并不对knockoutjs友好，使用jquery几乎不可避免。
+要让jquery操作knockoutjs的DOM关键在于template渲染完成后主动向外发出通知，jquery再截获通知。
+渲染的核心代码在以下位置:
+vendor/magento/module-ui/view/base/web/js/lib/ko/template/renderer.js
+
+
 ko 的文档里提到了三种模板引擎
     ko 自身的
         大致分成四部分