sprignboot(1)-生成模板創建項目、引入自己的前端模板(以ECharts爲例)

又是一年金秋時,桂花香,才子笑,甚好!
最近又要開始拿起Springboot做項目了,上次接觸Springboot項目是大二暑假剛進入網絡中心實驗室的時候,當時真的什麼也不會,對這個框架也只是略知皮毛,不理解地做開發。現在有一些經驗了,自己理解的也更多了,希望能順利完成這個項目,得到更多的提升。
今天,來敘述一下自己剛開始遇到的一些小問題,希望能給大家一些建議,嘿嘿~:)
1、生成模板,創建項目
前面的引入教程,網上很多,我主要分享一下後面的處理代碼吧。首先從git上下載好admin-master的代碼,放在本地合適的運行環境和配置環境下,訪問對應配置的項目地址即可訪問。
在這裏插入圖片描述
如上圖,代碼生成可以很方便幫我們生成對應的功能代碼,並且包含了基本的架構信息,明天重新截圖給大家好好講一下運行代碼的流程。
在這裏插入圖片描述
在我們生成的代碼中,即可看到很清晰的項目功能架構,其中MainApplication是啓動文件,運行這個代碼即可。
2、引入自己的前端模板(以ECharts爲例)
springboot後臺框架裏resources下的templates是放對應的html頁面,也就是視圖文件。而上面的static是放對應的js的資源文件。
主要是引入路徑的問題,如下圖:
在這裏插入圖片描述
在這裏插入圖片描述
以引入ECharts模板爲例,先從官網上下載對應的js文件,代碼中必須引入spring boot的thymeleaf依賴,是一種現代的Java模板引擎。然後對應的html文件放在templates下面,因爲生成的代碼的命名不同,注意這裏是:templates.angel1.users。將對應下載的echarts.min.js放在static目錄下面,注意這裏是:static.js.angel.users。這裏的寫法其實是分目錄。
查看文件地址,可知,
result.html地址是:
F:***\sample\src\main\resources\templates\angel1\users\result.html
echarts.min.js地址是:
F:*\sample\src\main\resources\static\js\angel1\users\echarts.min.js
所以當在html中引入js文件的時候,需要上溯到同一級的目錄下,
這裏引入的是’…/…/js/angel1/echarts.min.js’
如果static沒有分目錄的話,直接包的名字就是static,引入改js的寫法應該是’js/angel1/echarts.min.js’

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章