在JIRA開發Plugin過程中，曾遇到過頁面如何引入外部資源（CSS、JS、IMG）問題，此前在開發Plugin時，我是直接將CSS、JS寫在頁面裏（時間限制）。不過前幾天，這些問題已經解決，原來也是那麼簡單。好了，廢話少說，接下來我只將我實現的方式告訴大家，如果各位有其他方法或建議或批評，請直接點評，在這裏先謝謝各位了。前提:
1、JIRA 環境；
2、成品 project-management-plugin.jar 插件包，其中該插件中有showProjectManagement.vm、proj_mgt.css、proj_mgt.js 三個文件。
目的：
1、頁面（showProjectManagement.vm）如何能引用到CSS、JS文件。
實現方式1：直接引用Plugin包中存在的CSS、JS資源文件。
首先，配置atlassian-plugin.xml文件，如下：
<web-resource key="proj.mgt.web.resource" name="PROJ-MANAGEMENT Resources" state="enabled">
<resource type="download" name="proj_mgt.css" location="template/project/management/style/palms_proj_mgt.css" />
<resource type="download" name="proj_mgt.js" location="template/project/management/style/_mgt.js" />
</web-resource>其次，在showProjectManagement.vm 頁面頂部增加如下代碼：$webResourceManager.requireResource("project.management.palms-project-management-plugin:proj.mgt.web.resource")這些代碼是什麼？怎麼來的呢？彆着急，我一會解釋清楚。$webResourceManager.requireResource（）: 這個大家不用去擔心，這是JIRA內部類方法。我們只關心裏面參數，請注意參數中不同顏色區域。project.management.project-management-plugin: 這一長串就是atlassian-plugin.xml文件的根節點的Key值，請大家到最後看atlassian-plugin.xml、pom.xml配置文件內容便可以得到答案。proj.mgt.web.resource：這個大家應該可以從上面貼出的代碼中找到，對，就是<web-resource>節點的Key值。相信這樣解釋大家都可以明白了吧。這兩部配置完成，那麼你就算是成功了。實現方式2：直接引用server端的CSS、JS等資源。1、假設我們在%JIRA_HOME%/style/css/proj_mgt.css，%JIRA_HOME%/style/js/proj_mgt.js有這麼2個文件。2、找到%JIRA_HOME%/WEB-INF/classes/system-webresources-plugin.xml文件，打開作如下配置，<web-resource key="pal.proj.mgt.plugin.web.resource" i18n-name-key="admin.web.resources.plugin.calendar.zh.name" name="Calendar" state="enabled"><resource type="download" name="proj_mgt.css" location="/style/css/proj_mgt.css"><param name="source" value="webContextStatic" /></resource><resource type="download" name="proj_mgt.js" location="/style/js/proj_mgt.js"><param name="source" value="webContextStatic" /></resource></web-resource>3、回到Plugin中找到atlassian-plugin.xml文件，做以下配置，<web-resource key="proj.mgt.web.resource" name="PROJ-MANAGEMENT Resources" state="enabled"><dependency>jira.webresources:proj.mgt.plugin.web.resource</dependency></web-resource>說明：jira.webresources:文件 system-webresources-plugin.xml根節點的Key值；proj.mgt.plugin.web.resource： <web-resource >的Key值4、在頁面頂部添加以下代碼：$webResourceManager.requireResource("project.management.project-management-plugin:proj.mgt.web.resource")解釋與第一種方式相同，此處略。第二種方式也完成了.atlassian-plugin.xml 部分內容：<atlassian-plugin key="project.management.project-management-plugin" name="project-management-plugin" plugins-version="2"><project-tabpanel key="proj-mgt-plugin-panel" name="Porject Managment Plugin Panel" class="project.management.panel.ProjectManagementTabPanel"><web-resource key="proj.mgt.web.resource" name="PROJ-MANAGEMENT Resources" state="enabled"><!-- configuration web resource on the web server -->
<dependency>jira.webresources:proj.mgt.plugin.web.resource</dependency><!-- configuration web resource in plugin --><resource type="download" name="proj_mgt.css" location="template/project/management/style/proj_mgt.css" /><resource type="download" name="proj_mgt.js" location="template/project/management/style/proj_mgt.js" /></web-resource></atlassian-plugin>system-webresources-plugin.xml 文件內容：<atlassian-plugin key="jira.webresources" i18n-name-key="admin.web.resources.plugin.name" name="Web Resources Plugin"><web-resource key="proj.mgt.plugin.web.resource" i18n-name-key="admin.web.resources.plugin.calendar.zh.name" name="Calendar" state="enabled"><resource type="download" name="proj_mgt.css" location="/style/css/proj_mgt.css"><param name="source" value="webContextStatic" /></resource><resource type="download" name="proj_mgt.js" location="/style/js/proj_mgt.js"><param name="source" value="webContextStatic" /></resource></web-resource></atlassian-plugin>
本人QQ：787727097 Email：[email protected]