如何在 webstorm 中创建一个简单的 Angular js 项目答案

【问题标题】：How to create a simple angular js project in webstorm如何在 webstorm 中创建一个简单的 Angular js 项目
【发布时间】：2015-11-19 07:53:53
【问题描述】：

我已经安装了 webstorm 并尝试创建一个简单的 angular js 程序。

我在 webstorm 中创建了一个空项目，然后在 libs 目录中添加了 angular.js 文件。然后，当我尝试为 Angular js 编写代码时，自动完成功能不起作用。

这是问题的截图。

请帮助我如何在 webstorm 中创建 angular js 程序？

更新：

现在我按照JetBrains Doc 中的Installing AngularJS Manually 步骤将Angular JS 添加为依赖项。还从我的项目中删除了 angular js 文件，该文件是我在这篇文章中的第一张图片的一部分。

即便如此，我也无法看到自动完成功能正常工作。我已经验证在我的 webstorm 中启用了 angular js 插件。请让我知道可能是什么问题？

更新：

我的 webstorm 中已经启用了 Angular JS 插件，请查看下图：

【问题讨论】：

为什么不使用 Yeoman 创建一个带有生成器的项目 - yeoman.io 这将为您提供更好的应用程序结构、构建工具、包管理器、单元测试......并且您的 IDE 应该更好地配备这个。

标签： javascript angularjs webstorm

【解决方案1】：

不是一个真正的答案（您是否保存了 HTML，为什么不将您的 JS 代码放入外部文件）...但为什么不使用 Yeoman 使用生成器创建一个项目 - http://yeoman.io/ 这将为您提供更好的应用程序结构、构建工具、包管理器、单元测试……你的 IDE 应该为此配备得更好。

这也可能有帮助：http://blog.jetbrains.com/webstorm/2014/07/how-webstorm-works-completion-for-javascript-libraries/

【讨论】：

我不知道约曼，从未尝试过。我尝试将 JS 代码保存在单独的 JS 文件中，但仍然是同样的问题，自动完成不起作用。

【解决方案2】：

Webstorm 有一个 AngularJs 插件。这将使您在 html 文件中自动完成。请参阅本教程如何安装它： youtube tutorial

甚至还有一个文档页面表单 JetBrains 解释了如何创建一个 AngularJs 项目： JetBrains Doc

【讨论】：

我已经按照文档中的步骤操作了，但还是同样的问题，我已经更新了我的帖子，请你看看。
@user3181365 用于自动完成需要插件。请参阅此文档以在 Webstorm 中安装插件：jetbrains.com/webstorm/help/enabling-and-disabling-plugins.html
webstorm 中已经启用插件，在我的帖子中添加了截图，请检查。

【解决方案3】：

发现于WebStorm doc

将 AngularJS 配置为 WebStorm JavaScript 库，让 WebStorm 识别 AngularJS 特定的结构并提供完整的编码帮助：打开设置对话框，然后单击 JavaScript 库。在库区域中，单击添加按钮。在打开的“新建库”对话框中，指定库的名称。单击库文件列表旁边的添加按钮，然后在上下文菜单上选择附加文件或附加目录，具体取决于您需要单独的文件还是整个文件夹。在打开的对话框中选择 Angular.js 或 Angular.min.js，或整个目录。 WebStorm 返回到 New Library 对话框，其中 Name 只读字段显示所选文件或文件夹的名称。在类型字段中，指定您已下载并要添加的版本。如果您添加了 Angular.js，请选择调试。这个版本对开发环境很有帮助，尤其是调试。如果您添加了缩小的 Angular.min.js，请选择 Release。此版本在生产环境中很有帮助，因为文件大小要小得多。

或查看this blog post

【讨论】：

关注了博客，但同样的问题。更新了我的帖子详细信息，请检查。