從框架模板生成IntelliJ IDEA項(xiàng)目

注意：此功能僅在 Ultimate 版本中受支持。

在創(chuàng)建 IntelliJ IDEA 項(xiàng)目的過(guò)程中，IntelliJ IDEA 可以生成用于開(kāi)發(fā) Web 應(yīng)用程序的項(xiàng)目或模塊存根。已經(jīng)設(shè)置了項(xiàng)目或模塊結(jié)構(gòu)，并根據(jù)您的請(qǐng)求下載的外部模板和框架生成一些源。

基于以下框架模板生成 IntelliJ IDEA 項(xiàng)目或模塊存根：

• 設(shè)計(jì)者項(xiàng)目。
• Drupal 模塊
• WordPress 項(xiàng)目。
• HTML5 Boilerplate，Twitter Bootstrap（推特引導(dǎo)）和客戶(hù)端應(yīng)用程序存根的基礎(chǔ)。
• Node.js Express 用于服務(wù)器端應(yīng)用程序使用 Node.js 和 Node.js Boilerplate
• Dart Web 應(yīng)用程序存根用于開(kāi)發(fā)應(yīng)用程序的客戶(hù)端。
• Meteor 項(xiàng)目存根為應(yīng)用程序的客戶(hù)端和服務(wù)器端。
• PhoneGap /Apache Cordova /離子項(xiàng)目存根。
• AngularJS 項(xiàng)目存根。

生成HTML5 Boilerplate，Web 入門(mén)工具包，React 入門(mén)工具包，Twitter Bootstrap 或 Foundation 應(yīng)用程序存根

1. 在主菜單上選擇“文件 |新 |項(xiàng)目（File | New | Project ）” 或單擊 "歡迎界面" 上的 "新建項(xiàng)目" 按鈕。
2. 在 "項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框 (即 "新建項(xiàng)目" 向?qū)У牡谝豁?yè)) 中，在左側(cè)窗格中選擇 "靜態(tài)站點(diǎn)"。
3. 在右側(cè)窗格中，根據(jù)您的首選項(xiàng)和要在應(yīng)用程序中實(shí)現(xiàn)的功能，選擇要使用的模板：靜態(tài)站點(diǎn)（Static Web）：HTML5 Boilerplate：選擇此選項(xiàng)可使用 HTML5 Boilerplate 模板。這是一個(gè)可以輕松適應(yīng)您需求的起始項(xiàng)目模板。Web 初學(xué)者工具包：選擇此選項(xiàng)可使用 web 初學(xué)者工具包。React 初學(xué)者工具包：選擇此選項(xiàng)以使用 React 初學(xué)者工具包。Twitter Bootstrap：選擇此選項(xiàng)可以使用 Twitter Bootstrap 模板，這是一個(gè)精心設(shè)計(jì)的模塊化工具包，具有豐富的 HTML，CSS和 JavaScript 支持?；A(chǔ)：選擇此選項(xiàng)使用基礎(chǔ)框架。單擊 "下一步"，準(zhǔn)備就緒。
4. 在向?qū)У牡诙?yè)上，指定以下內(nèi)容：項(xiàng)目的名稱(chēng)和要在其中創(chuàng)建它的文件夾。要使用的模板的版本。在準(zhǔn)備就緒時(shí)單擊 "完成"。

生成一個(gè) Node.js Express 應(yīng)用程序存根

生成這樣的應(yīng)用程序存根要求 IntelliJ IDEA 支持 Node.js：

1. 在您的計(jì)算機(jī)上下載并安裝該 Node.js 的運(yùn)行環(huán)境。
2. 該 Node.js 資源庫(kù)插件已安裝并啟用。該插件不與 IntelliJ IDEA 捆綁在一起，但可以從中安裝 JetBrains 插件庫(kù) ，如安裝，更新和卸載存儲(chǔ)庫(kù)插件并且啟用和禁用插件。

生成 Node.js 應(yīng)用程序存根：

1. 在主菜單上選擇“文件|新|項(xiàng)目（File | New | Project）”，或單擊 "歡迎界面" 上的 "新建項(xiàng)目" 按鈕。
2. 在 "項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框 (即 "新建項(xiàng)目" 向?qū)У牡谝豁?yè)) 中，在左側(cè)窗格中選擇 Node.js 和 NPM。
3. 在右側(cè)窗格中，選擇 Node.js Express 應(yīng)用程序并單擊 "下一步"。
4. 在向?qū)У牡诙?yè)上，指定以下內(nèi)容：項(xiàng)目名稱(chēng)及和要在其中創(chuàng)建它的文件夾。對(duì) Node.js 的可執(zhí)行文件的路徑 node.exe 和 到 Node.js 包管理器文件 npm.cmd。使用 Express 模板引擎。從 "模板引擎" 下拉列表中，選擇以下之一：
   • Jade - haml.js 后繼者.
   • EJS - 嵌入式 JavaScript.
   • Hogan.js.
   • Handlebars.
5. 單擊 "完成"，準(zhǔn)備就緒。IntelliJ IDEA 啟動(dòng)"快速項(xiàng)目生成器(Express Project Generator)" 工具，它可以下載所有必需的數(shù)據(jù)，設(shè)置項(xiàng)目結(jié)構(gòu)，并在當(dāng)前窗口或新項(xiàng)目中打開(kāi)，具體取決于您的選擇。

生成 Dart 應(yīng)用程序存根

生成 Dart 應(yīng)用程序存根要求 IntelliJ IDEA 支持 Dart：

1. 您的計(jì)算機(jī)上提供了 Dart SDK。
2. 已安裝并啟用 Dart 插件。該插件不與 IntelliJ IDEA 捆綁在一起，但可以從 JetBrains 插件庫(kù)中安裝，如安裝，更新和卸載存儲(chǔ)庫(kù)插件并且啟用和禁用插件。

生成 Dart 應(yīng)用程序存根：

1. 在主菜單上選擇“文件| 新|項(xiàng)目（File | New | Project）”，或單擊 "歡迎界面" 上的 "新建項(xiàng)目" 按鈕。
2. 在 "項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框 (即 "新建項(xiàng)目" 向?qū)У牡谝豁?yè)) 中，在左側(cè)窗格中選擇 "Dart"。
3. 在右側(cè)窗格中，根據(jù)您要開(kāi)發(fā)的應(yīng)用程序的類(lèi)型選擇存根的類(lèi)型?？捎眠x項(xiàng)的數(shù)量取決于當(dāng)前使用的舞臺(tái)，請(qǐng)參見(jiàn) http://stagehand.pub/ 以獲取詳細(xì)信息。單擊 "下一步"。
4. 在向?qū)У牡诙?yè)上，指定 Dart SDK 的路徑，并可以選擇指定 Dartium 可執(zhí)行文件（Windows 和 Linux）/ Dartium 應(yīng)用程序（在 macOS 系統(tǒng)中）。IntelliJ IDEA 檢測(cè)并顯示 Dart 版本。在準(zhǔn)備就緒時(shí)單擊 "完成"。

如有必要， 可以通過(guò)單擊 "設(shè)置" 按鈕并為 Dartium 配置 command-line 選項(xiàng)和自定義用戶(hù)數(shù)據(jù)目錄來(lái)打開(kāi) "設(shè)置" 對(duì)話框的 Dart 頁(yè)。

生成 Meteor 應(yīng)用程序存根

當(dāng)您單擊 "完成" 時(shí)，IntelliJ IDEA 生成一個(gè) Meteor 應(yīng)用程序的框架，包括 HTML 文件，JavaScript 文件，CSS 文件和帶有子文件夾的 .meteor。.meteor/local 用于存儲(chǔ)內(nèi)置應(yīng)用程序的文件夾將自動(dòng)標(biāo)記為排除并且不涉及索引。

默認(rèn)情況下，已排除的文件顯示在項(xiàng)目樹(shù)中。要將 .meteor/local 文件夾隱藏，請(qǐng)單擊 "項(xiàng)目" 工具窗口工具欄上的按鈕，并刪除 "顯示排除的文件" 選項(xiàng)旁邊的刻度。

IntelliJ IDEA 還自動(dòng)將預(yù)定義的 Meteor 庫(kù)附加到項(xiàng)目中，從而啟用語(yǔ)法高亮，解析參考和代碼完成。有關(guān)詳細(xì)信息，請(qǐng)參見(jiàn)配置 JavaScript 庫(kù)。

Meteor 使用空格鍵模板，是擴(kuò)展的 Handlebars/Mustache 模板。IntelliJ IDEA 認(rèn)可空格鍵模板，但作為一個(gè)副作用標(biāo)記在 Meteor 項(xiàng)目中的 HTML 文件與Handlebars/Mustache 圖標(biāo)。

1. 在主菜單上選擇“文件 |新 |項(xiàng)目（File | New | Project）”或者單擊 "歡迎界面"上的"新建項(xiàng)目"按鈕。
2. 在 "項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框 (即 "新建項(xiàng)目" 向?qū)У牡谝豁?yè)) 中，在左側(cè)窗格中選擇靜態(tài)Web。
3. 在右側(cè)窗格中，選擇 Meteor JS App 并單擊 "下一步"。
4. 在向?qū)У牡诙?yè)上，指定項(xiàng)目名稱(chēng)和要在其中創(chuàng)建的文件夾。指定 Meteor 可執(zhí)行文件的位置 (請(qǐng)參閱安裝 Meteor)。
5. 從 "模板" 下拉列表中，選擇要生成的示例。要生成基本的項(xiàng)目結(jié)構(gòu)，選擇默認(rèn)選項(xiàng)。
6. 在 "文件名" 文本框中，鍵入將生成的相互關(guān)聯(lián)的 .js、.html 和 .css 文件。僅當(dāng)從模板下拉列表中選擇默認(rèn)示例類(lèi)型時(shí)，該文本框才可用。

生成 PhoneGap / Cordova / Ionic 應(yīng)用程序存根

1. 在主菜單上選擇“文件 |新 |項(xiàng)目（File | New | Project）”或者單擊 "歡迎界面"上的"新建項(xiàng)目"按鈕。
2. 在"項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框 (即 "新建項(xiàng)目" 向?qū)У牡谝豁?yè)) 中，在左側(cè)窗格中選擇靜態(tài)Web。
3. 在右側(cè)窗格中，選擇 PhoneGap / Cordova 應(yīng)用程序，然后單擊 "下一步"。
4. 在向?qū)У牡诙?yè)，指定項(xiàng)目名稱(chēng)和要在其中創(chuàng)建的文件夾。指定可執(zhí)行文件的位置：phonegap.cmd，cordova.cmd 或者 ionic.cmd （見(jiàn)安裝PhoneGap / Cordova / Ionic）。

當(dāng)您單擊 "完成" 時(shí)，IntelliJ IDEA生成一個(gè)PhoneGap / Cordova / Ionic 應(yīng)用程序的框架，該框架具有特定的結(jié)構(gòu)。

生成 AngularJS 應(yīng)用程序

這要求 AngularJS 插件已安裝并啟用。該插件不與 IntelliJ IDEA 捆綁在一起，但可以從 JetBrains 插件庫(kù)中安裝，如安裝，更新和卸載存儲(chǔ)庫(kù)插件并且啟用和禁用插件。

IntelliJ IDEA 可以生成一個(gè)項(xiàng)目存根，用于開(kāi)發(fā)使用 AngularJS 的應(yīng)用程序。生成一個(gè)Angular 存根，請(qǐng)使用 Angular CLI，見(jiàn) Angular。

生成一個(gè) Angular 1 應(yīng)用程序存根的過(guò)程：

1. 在主菜單上選擇“文件 |新 |項(xiàng)目（File | New | Project）”或者單擊 "歡迎界面"上的"新建項(xiàng)目"按鈕。
2. 在"項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框 (即 "新建項(xiàng)目" 向?qū)У牡谝豁?yè)) 中，在左側(cè)窗格中選擇靜態(tài)Web。
3. 在右側(cè)窗格中，選擇 AngularJS 并單擊 "下一步"。
4. 在向?qū)У牡诙?yè)上，指定項(xiàng)目名稱(chēng)和要在其中創(chuàng)建的文件夾。
5. 當(dāng)您單擊完成時(shí)，IntelliJ IDEA 會(huì)根據(jù) AngularJS 種子項(xiàng)目生成具有所有必需配置文件的 AngularJS 特定的項(xiàng)目結(jié)構(gòu)。
6. 下載包含 AngularJS 代碼的 AngularJS 依賴(lài)項(xiàng)和支持開(kāi)發(fā)和測(cè)試的工具： 打開(kāi)嵌入式終端 (查看 |工具窗口 |終端) ，并在命令提示符下安裝類(lèi)型 npm。

當(dāng)您單擊 "完成" 時(shí)，IntelliJ IDEA 生成一個(gè) AngularJS 應(yīng)用程序的框架，它具有框架特定的結(jié)構(gòu)。

生成 Composer 項(xiàng)目存根

您可以使用 Composer 從現(xiàn)有包中生成項(xiàng)目存根。

在這種情況下，Composer 將被初始化，并在項(xiàng)目存根創(chuàng)建期間安裝一個(gè)包。

之后，您可以從命令行或通過(guò)用戶(hù)界面使用 Composer。

1. 打開(kāi) "新建項(xiàng)目" 對(duì)話框，選擇文件|新建項(xiàng)目（File | New Project）或單擊 "歡迎界面"上的 "新建項(xiàng)目"。
   
2. 在左側(cè)窗格中選擇項(xiàng)目類(lèi)型和位置，單擊列表中的 "PHP"，然后在右側(cè)窗格中選擇 Composer Project，然后單擊 "下一步"。在向?qū)У牡诙?yè)上，指定項(xiàng)目名稱(chēng)和將要?jiǎng)?chuàng)建的文件夾。
3. 選擇 composer.phar 來(lái)使用要使用先前下載的命令 composer.phar，請(qǐng)選擇“使用現(xiàn)有的 composer.phar” ，并在文本框中指定其位置。要下載 Composer 的新實(shí)例，請(qǐng)選擇“從 getcomposer.org 下載 composer.phar”。該 composer.phar 文件將保存在項(xiàng)目根文件夾中指定的位置文本框。
4. 指定要使用的 PHP 解釋器從列表中選擇一個(gè)已配置的 php 解釋器，請(qǐng)參閱配置遠(yuǎn)程 PHP 解釋器和配置本地 PHP 解釋器的詳細(xì)信息。
5. 指定項(xiàng)目創(chuàng)建期間要安裝的軟件包，從"可用包"列表中選擇要添加的包，可能使用 "搜索" 字段，然后從 "安裝版本" 列表中選擇相關(guān)版本。
6. 選擇在 "命令行參數(shù)" 文本框中, 鍵入其他命令行參數(shù)。例如，要將包添加到 require-dev 部分而不是默認(rèn) require 部分，請(qǐng)鍵入：--dev。有關(guān)安裝過(guò)程中Composer 命令行選項(xiàng)的更多信息，請(qǐng)參閱：https://getcomposer.org/doc/03-cli.md。

當(dāng)你單擊 "完成" 時(shí)，create-project 使用選定的包調(diào)用該命令。這將導(dǎo)致創(chuàng)建一個(gè) Composer 項(xiàng)目，其配置和結(jié)構(gòu)取決于所選的包，請(qǐng)參閱：https://getcomposer.org/doc/03-cli.md了解詳情。然后，IntelliJ IDEA 項(xiàng)目將打開(kāi)。

生成WordPress應(yīng)用程序存根

1. 選擇文件|新建項(xiàng)目（File | New Project）或單擊 "歡迎界面"上的 "新建項(xiàng)目"。將打開(kāi) "項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框。
2. 在左側(cè)窗格中， 單擊列表中的 PHP，然后在右側(cè)窗格中選擇 WordPress 插件，然后單擊“下一步”。
3. 在向?qū)У牡诙?yè)上，指定項(xiàng)目名稱(chēng)和將要?jiǎng)?chuàng)建的文件夾。在 WordPress 安裝路徑文本框中，指定安裝 WordPress 的文件夾。該文件夾應(yīng)包含 wp-admin 和 wp-includes 子目錄。單擊 "完成" 以啟動(dòng)項(xiàng)目存根生成。
4. 如果新創(chuàng)建的項(xiàng)目位于 WordPress 安裝文件夾之外，則將其作為外部庫(kù)進(jìn)行配置，將其添加到包含的路徑列表中。通過(guò)按 Ctrl+Alt+S 或選擇 "設(shè)置/首選項(xiàng)" 對(duì)話框打開(kāi)“File | Settings（文件|設(shè)置）”（ Windows 和 Linux 中）或 （IntelliJ IDEA | Preferences）（在 macOS 系統(tǒng)中），然后單擊 "語(yǔ)言和框架" 下的 "PHP"。在打開(kāi)的 PHP 頁(yè)面上，將 WordPress 安裝文件夾的路徑添加到包含路徑列表中：?jiǎn)螕?img src="https://atts.w3cschool.cn/attachments/image/20171009/1507535828910671.png" alt="">按鈕，并在打開(kāi)的對(duì)話框中指定安裝文件夾的路徑。

生成 Drupal 模塊存根

tip：IntelliJ IDEA 根據(jù)所選的 Drupal 版本生成并配置了項(xiàng)目存根。對(duì)于 Drupal 8，將生成一個(gè)module_name.info.yml文件。

1. 選擇文件|新建項(xiàng)目（File | New Project）或單擊 "歡迎界面"上的 "新建項(xiàng)目"。將打開(kāi) "項(xiàng)目類(lèi)別和選項(xiàng)" 對(duì)話框。
2. 在左側(cè)窗格中，單擊列表中的 PHP，然后右鍵單擊選擇 Drupal 模塊，然后單擊“下一步”。
3. 在向?qū)У牡诙?yè)上，指定項(xiàng)目名稱(chēng)和將要?jiǎng)?chuàng)建的文件夾。
4. 指定 Drupal 安裝的根文件夾，并選擇要使用的 Drupal 版本，受支持的版本為6、7 和 8。
5. 選擇“設(shè)置PHP|包含路徑復(fù)選框（Set up PHP | Include paths check box）”以使 Drupal 包含為項(xiàng)目自動(dòng)配置的路徑。離開(kāi)對(duì)話框后，以下路徑將添加到 PHP 頁(yè)面上的包含路徑列表中：<drupal installation root>/includes，<drupal installation root>/modules，和 <drupal installation root>/sites/all/modules。
   

稍后您可以更改 Drupal 安裝并重新配置框架頁(yè)上的包含路徑。如何更改Drupal設(shè)置？

IntelliJ IDEA 根據(jù)所選的 Drupal 版本生成一個(gè)項(xiàng)目存根。對(duì)于 Drupal 8，將生成一個(gè) module_name.info.yml 文件，其中提供了有關(guān)模塊的信息。