Mpvue開發小程序開發環境搭建過程

實驗項目叫做神記事，英文名微信。就是一個記事本小程序。

npm 微信微信vue init mpvue

其中wxmp appid后臺 - 開發設置 - AppID(小程序ID)。

所有其他設置都可以默認。

cd 微信npm 微信npm run dev

實施后，使用微信開發者工具選擇D:/微信/，可預覽項目。

此時微信開發者工具右上角沒有騰訊云按鈕，需要到后臺打開。

然后進入騰訊云管理界面。

在騰訊云管理界面，您會發現第三步是下載測試代碼，可以選擇微信版本和PHP由于微信版比較簡單，所以我先下載了微信版。

你會發現文件名是微信dejs...那么這微信是什么呢？

簡單地說，微信是一套工具包，用戶只需要打開，就可以使用開發人員工具上傳、部署和調試小程序的后端代碼，無需了解服務器運行維護和數據庫部署構建。當然，如果您的小程序是純前端程序，不需要后端交互，則無需安裝工具包。

這個包包含了目前最受歡迎的包koa2框架類似于PHP語言的微信、微信...等待框架。顯然，你也需要koa2相關知識。

就我個人而言，我對小程序充滿敬畏。我不認為前端程序員需要包括所有的后端工作。如果前端程序員能夠包括后端并實現所謂的全堆棧，這只能表明這個小程序不會是一個大型和重要的項目。所以，當你正處于學習小程序開發的階段時，只要是正確的koa2有基本的掌握，可以做數據庫添加、刪除和檢查，當你真正開發小程序為職業，后端程序員使用什么語言是他的事，你只需要讓他po給你一個界面。如果你真的打算全棧，更熟悉PHP語言，也無妨，以后再改。甚至說，如果你的后端是對的，Java最熟悉，也可以，但只能離開騰訊云，需要使用自己的服務器，因為騰訊云不提供Java環境。

網上有很多相關文件，比如 騰訊云 微信，輕松部署小程序后端！

該文件在項目根目錄中，第10行是"微信": "dist/wx/",，附加1行代碼，即指定微信文件夾的路徑：

事實上，有一個細節。在設置此步驟之前，您的開發人員工具右上角始終沒有騰訊云按鈕。即使您查找工具 - 工具欄管理 - 自定義工具管理，您仍然找不到騰訊云按鈕，因為您沒有設置微信目錄，開發人員工具認為您的小程序不需要后端。騰訊云按鈕將出現，直到設置微信路徑。現在鉤住它（如果沒有，應該可以找到重啟工具）

點擊工具右上角的騰訊云按鈕，選擇微信環境或PHP環境，我們選擇微信環境。

再次單擊騰訊云按鈕，就可以看到下拉菜單，我們目前還沒有使用這些功能，因為下一步我們建立當地的開發環境。

先仔細閱讀微信小程序開發者工具的官方說明 自行部署 www.www88606.com Demo，查看上傳 Demo 和啟動節的內容。

具體說，將

貼到微信里面。微信相關跳過，微信相關如實填寫。

騰訊云后臺右上角菜單的賬號信息來自微信。

騰訊云后臺右上角菜單的微信和微信訪問管理，然后點擊左側API秘鑰管理，如果沒有秘鑰，新建秘鑰。然后從中 ** 其中微信需要先填寫手機驗證碼。

然后執行微信目錄npm 微信，安裝相關依賴。

請注意，如果您在第三步遇到微信的錯誤報告，這個問題就會跟進MySQL與低版本有關，解決方案：要么升級您的集成環境，要么安裝另一個集成開發環境。

我個人選擇一個環境，比如XAMPP的便攜版（www.www88606.com），然后修改端口：

此時，第2步和第3步可以成功導入sql文件。

施工：

一、新建一個koa2控制器，叫demo

微信/微信目錄

二、新路由，又稱demo

在微信/微信目錄的：

到此，demo API構建完畢。

在微信目錄敲入node app，啟動http服務。

瀏覽器訪問頁面顯示：

測試成功。

微信在微信界如雷貫耳，其功能是修改監控文件，幫助您隨時重啟您的服務。

這樣就安裝好了，不用做任何配置。

今后啟動服務就不再是node app，而是微信app。

之后，你需要每天打開兩個命令行窗口，一個用于執行npm run dev，另一個負責前端開發的目錄是執行微信app，負責啟動http服務。

我們當地環境的域名是，這顯然不是騰訊眼中的合法域名。因此，有必要在開發人員工具右上角的詳細信息中勾選不校驗合法域名...”。

這是什么？它的中文名稱是微信小程序客戶端騰訊云增強 SDK說白了就是提高會話能力的工具包。安裝在項目根目錄中：

使用方法：

在項目根目錄中中加入：

然后看看官方文檔。文檔稱，自2018年上半年以來，必須手動觸發微信登錄授權，并給出示例代碼。因此，我們的代碼大致：

請注意，官方文件是微信="微信"，我們在mpvue當然要改成@微信="微信"。

然后添加一種方法：

以上代碼也是修改官網提供的例子。注意兩點:

測試過程：從開發者工具中點擊微信，然后觀察控制臺，等幾秒鐘就會打印出自己的用戶信息。

默認情況下，mpvue沒有安裝scss所以我們手動安裝相關依賴:

上海西陸信息科技有限公司 承接各類微信小程序開發制作、小程序定制、APP 網站 開發制作，聯系電話 18221533805、15900430334