記一個微信小程序開發全過程（一）

咱們須要使用到的開發工具

1.  微信web開發者工具  2.  idea   3.  git

微信開發者工具是必須的 另外兩個可選

1、 搭建小程序工程

1.若是你開發過微信的項目， 基於微信框架開發程序都須要你有一個帳號 因此小程序也不例外先申請一個小程序的帳號

小程序接入指南

申請好了小程序以後 登陸小程序的後臺 設置小程序的基本信息以後 須要注意將小程序的祕鑰 及 appid 而後設置小程序訪問的後臺接口的地址

這個服務器域名須要與後臺確認 請求後臺接口須要在這裏配置不然將致使不能獲取後臺的數據 同時後臺也須要配置appid 及 小程序的祕鑰 具體這個後臺怎麼搭

建這裏就不介紹了。

2.利用開發者工具搭建項目的基本結構

項目目錄選擇一個空的文件夾 則能夠自動選擇一個模板進行開發 點擊建立/肯定 而後就能看到這個界面 同時在咱們的電腦文件夾下就會有咱們開發者工具

幫咱們生成的基本的項目的結構

這個就是微信web開發者工具幫咱們生成的基本小程序項目結構

3.使用idea進行項目的開發

首先咱們爲何要使用idea來進行小程序的項目的開發 web開發者工具也能進行開發啊 有編輯功能啊 這個微信的web開發者 用來看效果 及上傳代碼使用 開發的

話咱們仍是使用idea吧 使用起來比較習慣 並且功能強大

如何使用idea 這裏也很少作介紹了 使用idea來進行小程序的開發 咱們須要代碼高亮 那麼咱們就須要來了解小程序的中的文件的構成

js 爲後綴的文件是js文件(這個是和當前這個問夾下wxml 相關聯的 並且不須要像以前的前端開發須要 script 引用到對應的js 這裏logs.wxml對應的js就是這個logs.js 就算你這個wxml不要js也須要按照這個項目結構進行項目的搭建 )

一個後綴爲json的文件(這個是對整個logs 頁面（模塊）的功能的在小程序中的配置 例如配置當前這個頁面的title 這個頁面叫作日誌頁面 也可叫日誌模塊 還有一些其餘的配置都是在json中進行配置 通常都是一些固定的配置)

還有wxml 這個其實就是h5 中html 以及wxss 對應h5 中的 css 主要就是js wxss文件也好 都不須要在wxml引入 由於小程序的規範已經定義好了

而後咱們知道這個這些文件是什麼意思了以後 咱們在idea 中將wxss使用css 解析 wxml 使用html 進行解析 設置一下就 ok

在idea 中 file Type 中將 wxml 當html 解析 wxss 當作成 css 解析

如此一來咱們就能在idea 中進行小程序的開發了

如此一來咱們將開發前的準備工做作完了 關於app.json 及 app.js 看第二篇文章 記一個微信小程序開發全過程（二）