从框架模板生成项目

1. 选择文件 | 新建项目或单击欢迎屏幕上的新建项目。

2. 在左侧窗格中，选择Composer Project。在右侧窗格的位置字段中，指定将在其中创建项目的文件夹。

3. 选择 Composer 命令的执行方式：

   • 要通过全局安装的composer可执行文件运行命令，请选择“composer”可执行文件并在字段中指定其位置。

   • 要通过本地composer.phar存档运行命令，请选择composer.phar。然后，在字段中指定现有composer.phar文件的位置，或者选择从 getcomposer.org 下载 composer.phar复选框以下载该文件的新实例。下载的composer.phar文件将保存在项目根文件夹下。

     然后，从PHP 解释器列表中选择一个已配置的本地 PHP 解释器。有关详细信息，请参阅配置本地 PHP 解释器。

   或者，在命令行参数字段中，键入其他命令行参数。

4. 在包区域中，在包字段中键入所需包的名称。要使用代码完成，请按Ctrl+Space。然后从要安装的版本列表中选择相关版本。

6. 单击创建。将使用选定的包调用create-project Composer 命令。结果，将创建 Composer 项目，其配置和结构取决于所选包。之后，创建的 PhpStorm 项目将打开。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Drupal Module。

3. 在右侧窗格的位置字段中，指定将在其中创建项目的文件夹。

4. 指定 Drupal 安装的根文件夹并选择要使用的 Drupal 版本，支持的版本为 6、7 和 8。

5. 选择设置 PHP | 包含路径复选框让 Drupal 包含为项目自动配置的路径。离开对话框后，以下路径将添加到PHP页面的Include Paths列表中： <drupal 安装根目录>/includes、<drupal 安装根目录>/modules和<drupal 安装根目录>/sites/all/modules

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Joomla！整合。

3. 在右侧窗格的位置字段中，指定将在其中创建项目的文件夹。

   • Joomla安装路径

   • 项目类型（组件、模块或插件）

   PhpStorm 显示带有关于丢失 Joomla 的通知的气球！代码样式、命名空间等。通过单击相应的链接，可以立即安装这些元素。通知在状态栏和事件工具窗口中重复。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择WordPress Plugin。

3. 在右侧窗格中，指定将在其中创建项目的文件夹。

   在WordPress 安装路径字段中，指定安装 WordPress 的文件夹。此文件夹应包含wp-admin和wp-includes子目录。单击创建开始项目存根生成。

4. 如果新创建的项目位于WordPress安装文件夹之外，请将其添加到包含路径列表中，将其配置为外部库。

   1. 在设置/首选项对话框 ( Ctrl+Alt+S) 中，转到PHP。

   2. 在打开的PHP页面上，将WordPress安装文件夹的路径添加到包含路径列表中：单击按钮并在打开的对话框中指定安装文件夹的路径。在配置包含路径中了解更多信息。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择AngularJS。

3. 在右侧窗格中，指定将存储项目相关文件的文件夹的路径。

4. 当您单击Create时，PhpStorm 会生成AngularJS特定的项目结构，其中包含基于AngularJS 种子项目所需的所有配置文件

5. 下载包含AngularJS代码和支持开发和测试的工具的AngularJS依赖项：在嵌入式终端( ) 中，键入：Alt+F12

   npm install

   在readme.md文件的安装依赖项部分了解有关安装依赖项的更多信息。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，根据您的偏好和要在应用程序中实现的功能选择要使用的模板：

   • HTML5 Boilerplate：选择此选项以使用HTML5 Boilerplate模板。这是一个可以轻松适应您的需求的起始项目模板。

   • Web Starter Kit：选择此选项以使用Web Starter Kit。

   • Bootstrap：选择此选项以使用Bootstrap模板，这是一个精心设计的模块化工具包，具有丰富的 HTML、CSS 和 JavaScript 支持。

   • Foundation：选择此选项以使用Foundation框架。

3. 右侧窗格中的控件集取决于所选模板。

   1. 指定将存储项目相关文件的文件夹的路径。

   2. 从版本列表中，选择要使用的模板版本，然后单击创建。

生成 Node.js 应用程序

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Express。

3. 在右侧窗格中：

   1. 指定将存储项目相关文件的文件夹的路径。

   2. Node 解释器，请参阅配置本地 Node.js 解释器。

   3. 要使用的包管理器 - npm或Yarn，请参阅npm、pnpm 和 Yarn。

   4. 快递-发电机。

      建议您使用下载并运行生成器的 npx 。为此，请从express -generator列表中选择npx --package express-generator express 。

      或者，打开嵌入式终端( Alt+F12) 并键入npm install --g express-generator，然后从express-generator列表中选择下载的生成器。

   5. 要使用的Express 模板引擎。从模板引擎列表中，选择以下选项之一：

      • 灰尘

      • EJS

      • 车把

      • 霍根.js

      • 哈巴狗(哈巴狗 (翡翠) )

      • 枝条

      • 瓦什

      • 静态html

   6. 要使用的 CSS 引擎。从CSS 引擎列表中，选择以下选项之一：

      • 纯 CSS

      • 手写笔

      • 较少的

      • 萨斯。

4. 准备就绪后，单击创建。

   PhpStorm 启动Express Project Generator工具，该工具下载所有需要的数据，设置项目结构，并根据您的选择在当前窗口或新窗口中打开项目。

生成 Dart 应用程序

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Dart。

3. 在右侧窗格中：

   1. 指定将存储项目相关文件的文件夹的路径。

   2. 指定 Dart SDK 的路径。PhpStorm 检测并显示Dart 版本。

   准备好后单击创建。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Meteor。

3. 在右侧窗格中：

   1. 指定将存储项目相关文件的文件夹的路径。

   2. 指定Meteor可执行文件的位置（请参阅安装 Meteor）。

   3. 从模板列表中，选择要生成的样本。要生成基本项目结构，请选择默认选项。

   4. 在文件名字段中，键入将生成的相互关联的.js、.html和.css文件的名称。仅当从模板下拉列表中选择默认样品类型时，该字段才可用。

4. 当您单击Create时，PhpStorm 会生成Meteor应用程序的骨架，包括 HTML 文件、JavaScript 文件、CSS 文件和带有子文件夹的.meteor文件夹。PhpStorm 自动将用于存储构建应用程序的.meteor/local文件夹标记为已排除，但仍将其显示在项目树中。

   默认情况下，排除的文件显示在项目树中。要隐藏.meteor/local文件夹，请单击Project工具窗口的工具栏，选择Tree Appearance ，然后删除Show Excluded Files选项旁边的勾号。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Cordova。

3. 在右侧窗格中：

   1. 指定将存储项目相关文件的文件夹的路径。

   2. 指定可执行文件的位置。根据您的操作系统和目标平台，这可以是phonegap、phonegap.cmd、cordova或cordova.cmd。

4. 当您单击Create时，PhpStorm 会生成具有特定于框架的结构的 PhoneGap 或 Cordova 应用程序的骨架。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择React。

3. 在右侧窗格中，指定项目文件夹、要使用的 Node.js 解释器以及create-react-app包的路径。

4. 可选：

   要使用 TSX 而不是 JSX，请选中创建 TypeScript 项目复选框。PhpStorm 将为您的应用程序生成.tsx文件和tsconfig.json 配置文件。

5. 当您单击Create时，PhpStorm 会生成一个包含所有必需配置文件的特定于React的项目。

1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

2. 在左侧窗格中，选择Vue.js。

3. 在右侧窗格中：

   1. 指定将存储项目相关文件的文件夹的路径。

   2. 在Node Interpreter字段中，指定要使用的 Node.js 解释器。从列表中选择一个已配置的解释器或选择添加以配置一个新解释器。

   3. 从Vue CLI列表中，选择npx --package @vue/cli vue。

      或者，对于 npm 5.1 及更早版本，通过在终端@vue/cli中运行自己安装包。创建应用程序时，选择存储包的文件夹。npm install --g @vue/cli Alt+F12@vue/cli

   4. 从项目模板列表中，选择要使用的Vue.js 模板。

4. 当您单击Create时，PhpStorm 会询问您一些关于可以添加到项目中的工具的附加问题，例如 linter 和测试运行器。这些问题因您选择的模板而异。之后，PhpStorm 会生成一个包含所有必需配置文件的 Vue.js 特定项目。