微信小程式 剖析 執行機制

2021-08-01 03:14:36 字數 2794 閱讀 1415

解壓應用

首先你需要有下面的工具啦

drwxr-xr-x@


7 fdhuang  staff   238b sep 22


drwxr-xr-x@


4 fdhuang  staff   136b sep 21


13:12 modified_modules


drwxr-xr-x@


194 fdhuang  staff   6.4k sep 21


13:12 node_modules


-rw-r--r--    1 fdhuang  staff   900b sep 22


21:09


package.json
簡單的說明一下：

modified_modules/ 即一些修改後的模組

node_modules/ 地球人都知道

package.json 呵呵，你一定是知道的，配置了nw相關的內容

在modified_modules目錄下有兩個子模組：

ide執行順序

我們已經知道了這是乙個nodewebkit封裝的web應用了。

很順利的我們看到了他們呼叫的檔案了：

<


script


src=


>


script


>
這裡面有乙個init方法，看來他就是nodewebkit相關的入口了。用webstorm的shift + f6 rename 這些變數好十幾次，終於看到了下面的**了：

var react = require("../dist/lib/react.js");


var reactdom = require("../dist/lib/react-dom.js");


var init = require("../dist/common/loadinit/init.js");


var controller = require("../dist/components/containcontroller.js");


var proxy = require("../dist/common/proxy/startproxy.js");


var windowactions = require("../dist/actions/windowactions.js");


var webviewaction = require("../dist/actions/webviewactions.js");


var webviewstore = require("../dist/stroes/webviewstores.js");


var log = require("../dist/common/log/log.js");


var shortcut = require("../dist/common/shortcut/shortcut.js");
這是乙個react應用，還好我一年多以前學得不錯。掃視了一下**，終於看到了這一句：

reactdom


.render(react


.createelement(controller, null), document


.queryselector("#container")
直接跳轉到containcontroller.js，跳轉到render方法，找到了這個：

react.createelement(main, )
果然main裡面就是大入口了

react


.createelement("div", ,


react


.createelement(menubar, ),


react


.createelement(*******, ),


react


.createelement("div", ,


react


.createelement(sidebar, ),


react


.createelement(develop, ),


react


.createelement(edit, ),


react


.createelement(detail, )),


react


.createelement(toast, null),


react


.createelement(setting, ),


react


.createelement(dialog, null),


react


.createelement(popup, null),


react


.createelement(about, null))


}
對應的就是下面這個介面了：

detail就是專案的配置

慢慢的就探索到了打包，其執行時的過程。由於我並沒有拿到內測資格，所以我只好邊看邊猜測一下。

在之前的文章中，我們提到了兩點很有意思的東西：wxml和wxss，這兩個檔案會被分別轉換，即wxml -> html，wxss -> css。對應的有幾個不同的transform:

這種風格一看就是生成字串replace的，然後他們寫了乙個名為wcc以及乙個名為wcsc的工具。

當然無論是react + webview，或者vue + webview都不重要，現在有了 wa + webview了，哈哈。

上傳的過程大致如下：

HelloWorld 程式執行機制

1.隨便新建乙個資料夾，存放 新建乙個j a檔案檔案字尾名為.j a helloworld.j a 注意點 系統可能沒有顯示檔案字尾名，我們需要手動開啟3.編寫 public class helloworld 4.編譯j ac j a檔案，會生成乙個class檔案 5執行class檔案，j a cl...

Windows程式內部執行機制

2 sdk software development kit 軟體開發包 3 常用控制代碼 視窗控制代碼 hwnd 位圖控制代碼 hbitmap 圖示控制代碼 hicon 選單控制代碼 hmenu 檔案控制代碼 hfile 當前例項控制代碼 hinstance 全域性記憶體物件控制代碼 hgloba...

Windows程式內部執行機制

我們在寫c程式的時候會呼叫各種庫函式來輔助完成某些功能，例如printf，這就是api，windows作業系統提供了1000多種api函式。軟體開發包 software development kit 假如我們要開發呼叫中心，在購買語音卡的同時，廠商就會提供語音卡的sdk開發包，以方便我們對語音卡的...