正文 

当前位置： 首页 > 源码 >

如何使用 grunt-ngdocs 创建 api 文档

     2023-03-07     104

关键词：

【中文标题】如何使用 grunt-ngdocs 创建 api 文档【英文标题】：How to create api documents with grunt-ngdocs 【发布时间】：2014-09-13 14:34:51 【问题描述】：

我正在尝试通过 grunt-ngdocs 创建 API 文档。 部分已创建，但 index.html 没有正确的链接。

我的 gruntfile.js 中有：

module.exports = function (grunt) 

grunt.initConfig(
    pkg: grunt.file.readJSON('package.json'),
    karma: 
        unit: 
            configFile: 'karma.conf.js'
        
    ,
    uglify: 
        options: 
            // the banner is inserted at the top of the output
            banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
        ,
        dist: 
            files: 
                'web/js/app.min.js': ['web/js/app.js']
            
        
    ,
    ngdocs: 
        options: 
            dest: 'docs',
            scripts: ['web/js/app.js'],
            title: 'My Documentation'
        ,
        api: 
            src: ['web/**/*.js'],
            title: 'API Documentation'
        
    ,
    clean:['docs','testResult']


);

grunt.loadNpmTasks('grunt-karma');
grunt.loadNpmTasks('grunt-ngdocs');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.registerTask('default', ['clean','uglify', 'ngdocs', 'karma']);
;

和我这样的js文件

 /**
  * @ngdoc overview
  * @ngdoc directive
  * @name myApp.maincontroller:controller
  * @description
  *
  * # myApp
  * The factoryName is my favorite service in the world.
  *
  */


 var myApp = angular.module('myApp',[]);


 myApp.controller("MainController", function($scope) 
    $scope.model = 
        myValue: "Run you fools!"
    ;
   );


 /**
          * @ngdoc function
          * @name mySuperFunction
          * @returns int The int representing a Firebase resource
          */

 function mySuperFunction() 
    var i = 5;
    var j = 5;
    i += j;
    return i;

但是当我运行时

grunt

在命令行中，结果是这样的

 C:\Users\Lino Simões\Documents\bitbucket\test>grunt -d --force
 Running "clean:0" (clean) task
 [D] Task source: C:\Users\Lino Simões\Documents\bitbucket\test\node_modules\grun
 t-contrib-clean\tasks\clean.js
 Cleaning docs...OK

 Running "clean:1" (clean) task
 [D] Task source: C:\Users\Lino Simões\Documents\bitbucket\test\node_modules\grun
 t-contrib-clean\tasks\clean.js
 Cleaning testResult...OK

 Running "uglify:dist" (uglify) task
 [D] Task source: C:\Users\Lino Simões\Documents\bitbucket\test\node_modules\grun
 t-contrib-uglify\tasks\uglify.js
 File web/js/app.min.js created: 796 B → 210 B

 Running "ngdocs:api" (ngdocs) task
 [D] Task source: C:\Users\Lino Simões\Documents\bitbucket\test\node_modules\grun
 t-ngdocs\tasks\grunt-ngdocs.js
 Generating Documentation...
 DONE. Generated 2 pages in 256ms.

 Running "karma:unit" (karma) task
 [D] Task source: C:\Users\Lino Simões\Documents\bitbucket\test\node_modules\grun
 t-karma\tasks\grunt-karma.js
 INFO [karma]: Karma v0.12.17 server started at http://localhost:9876/
 INFO [launcher]: Starting browser PhantomJS
 INFO [PhantomJS 1.9.7 (Windows 7)]: Connected on socket dFX-dKGVINA6PBjB5Gu9 wit
 h id 91061839
 PhantomJS 1.9.7 (Windows 7): Executed 8 of 8 SUCCESS (0.008 secs / 0.004 secs)

 Done, without errors.

所以，这会生成 2 个文件，但是当我转到文档下的 index.html 时，我有这个：

但在我的 docs/partials/api/ 中，我有 ngdocs 创建的部分。

我的项目树是这样的：

【问题讨论】：

【参考方案1】：

您的 web/js/app.js 中有 angular.js 和 angular-animate.js 吗？检查。并添加到“选项”html5Mode: false

【讨论】：

我添加了html5Mode:false 和bestMatch: true。将scripts: ['web/js/app.js'] 更改为scripts: ['lib/angular.js']，就是这样。创建部分，但 index.html 等于上面的 控制台有什么异常？ 无，我在控制台的输出是这样的：Running "ngdocs:api" (ngdocs) task [D] Task source: C:\Users\Lino Simões\Documents\bitbucket\jenkins-test\node_modules\grunt-ngdocs\tasks\grunt-ngdocs.js Generating Documentation... DONE. Generated 2 pages in 424ms. 打开文档时在浏览器中检查控制台 我将 angular-animate 放在另一个目录中，一旦我放入正确的目录，效果就很好了。【参考方案2】：

ng1.6 适合我：

ngdocs: 
  all: ['app/**/*.js']

你会在

中看到旧版本的angular 1.2.* 
cat docs/js/angular.min.js  | grep v1
 AngularJS v1.2.16

但它不会影响您的源文件。

另外，别忘了运行服务器 对于生成的文件夹文档：

例如使用python

pushd ./dist; python -m SimpleHTTPServer 9000; popd #v 2.*
pushd ./dist; python -m http.server 9000; popd #v 3.*

不幸的是，将 angular.js 和 angular-animate.js 添加到脚本选项对我不起作用

【讨论】：

如何使用 api 创建 quickblox 应用程序？

】如何使用api创建quickblox应用程序？【英文标题】：HowtocreatequickbloxAppusingapi?【发布时间】：2017-02-1406:56:17【问题描述】：我想使用api(rubyonrails)在Quickblox上为我的应用程序创建多个应用程序，有没有办法使用apis或javascriptSDK创建... 查看详情

如何使用 firebase.com 创建 api 模拟器？

】如何使用firebase.com创建api模拟器？【英文标题】：Howtocreateapisimulatorusingfirebase.com?【发布时间】：2016-04-0403:17:58【问题描述】：我正在尝试使用我需要为其创建api连接的ionic框架创建应用程序。我的要求是我需要使用firebase。我... 查看详情

如何使用 Artemis JMS 管理 API 创建持久队列

】如何使用ArtemisJMS管理API创建持久队列【英文标题】：HowtocreatedurablequeueusingArtemisJMSManagementAPI【发布时间】：2017-11-3013:14:31【问题描述】：说来话长，但我需要使用ArtemisJMS管理API创建一个持久队列。目前代码默认创建一个临时... 查看详情

如何使用 Python 创建/管理 GCP API 密钥

】如何使用Python创建/管理GCPAPI密钥【英文标题】：HowdoIcreate/manageGCPAPIkeysusingPython【发布时间】：2020-10-0814:38:49【问题描述】：我正在尝试使用Python等客户端库访问GoogleCloudAPI服务，但是我无法从文档here中找到任何内容。文档真... 查看详情

如何使用无服务器创建 API 密钥并将其分配给创建的阶段 API？

】如何使用无服务器创建API密钥并将其分配给创建的阶段API？【英文标题】：HowtocreateandassignAPIKeytoacreatedstage-APIusingserverless?【发布时间】：2016-08-2100:46:48【问题描述】：我想使用无服务器创建一个安全的APIG，在我当前的“s-fctio... 查看详情

如何使用 Django Rest Framework 创建登录 API？

】如何使用DjangoRestFramework创建登录API？【英文标题】：HowdoIcreatealoginAPIusingDjangoRestFramework?【发布时间】：2014-02-1413:48:13【问题描述】：我想使用djangorest框架创建一个登录api（或者使用现有的，如果它已经预先捆绑）。但是，我... 查看详情

如何使用 REST API 在共享点中创建网页？

】如何使用RESTAPI在共享点中创建网页？【英文标题】：HowtocreatewebpageinsharepointusingRESTAPI?【发布时间】：2020-07-2205:25:33【问题描述】：我正在尝试在我的共享点站点下创建一个网页。我可以使用RESTAPI创建文档文件夹并在这些文件... 查看详情

如何从驱动程序 API 使用运行时 API 创建的上下文

】如何从驱动程序API使用运行时API创建的上下文【英文标题】：HowtousethecontextcreatedbytheruntimeAPIfromthedriverAPI【发布时间】：2012-05-1602:30:50【问题描述】：我链接到的库使用cuda运行时API。因此，它在第一次调用cuda函数时会隐式创... 查看详情

如何使用 AWS API 创建内联策略

】如何使用AWSAPI创建内联策略【英文标题】：HowtocreateinlinepolicywithAWSAPI【发布时间】：2022-01-1304:40:33【问题描述】：我正在编写需要在Java中以编程方式创建IAM角色的代码。我想要一个附加到角色的内联策略而不是托管策略。我... 查看详情

如何使用 swagger 使用 json 作为有效负载的 post 请求创建 api

】如何使用swagger使用json作为有效负载的post请求创建api【英文标题】：Howtocreateapiusingpostrequestwithjsonaspayloadusingswagger【发布时间】：2019-11-0123:48:44【问题描述】：我尝试使用swagger为发布请求创建api，但无法确定我应该在swagger中... 查看详情

如何使用 EWS 托管 API 2.0 创建笔记

】如何使用EWS托管API2.0创建笔记【英文标题】：HowtocreatenotesusingEWSManagedAPI2.0【发布时间】：2015-06-0308:23:24【问题描述】：即使查看MSDN\'sExchange2013-101CodeSamples，我也找不到使用EWSManagedAPI2.0创建笔记的示例。在FoldersanditemsinEWSinExcha... 查看详情

如何使用 CCK API 创建节点引用字段？

】如何使用CCKAPI创建节点引用字段？【英文标题】：HowtocreateanodereferencefieldusingtheCCKAPI?【发布时间】：2011-05-0421:06:38【问题描述】：我们目前正在构建一个自动创建内容类型的模块，它允许在任何Drupal平台上快速安装内容类型，... 查看详情

如何使用 API 创建 Paypal 连接（付款前卖家入职）帐户？

】如何使用API创建Paypal连接（付款前卖家入职）帐户？【英文标题】：HowtocreatingPaypalconnected(selleronboardingbeforepayment)accountusingAPI?【发布时间】：2021-02-1319:32:17【问题描述】：我想在付款前创建卖家入职账户（主支付业务账户下的... 查看详情

如何使用 golang kubernetes API 创建配置映射和机密

】如何使用golangkubernetesAPI创建配置映射和机密【英文标题】：HowtocreateconfigmapandsecretsusinggolangkubernetesAPI【发布时间】：2022-01-1713:31:30【问题描述】：如何使用GolangKubernetesAPI创建配置映射和机密【问题讨论】：【参考方案1】：您... 查看详情

如何使用 Java API 使用标准 SQL 创建 BigQuery 视图？

】如何使用JavaAPI使用标准SQL创建BigQuery视图？【英文标题】：HowdoIcreateaBigQueryviewwithstandardSQLusingtheJavaAPI?【发布时间】：2017-06-0920:06:58【问题描述】：我可以使用JavaAPI创建视图，但查询需要是旧版sql：publicvoidcreateView(StringdataSet,S... 查看详情

如何使用 jquery 和一些 API 创建天气小部件？

】如何使用jquery和一些API创建天气小部件？【英文标题】：HowtocreateaweatherwidgetusingjqueryandsomeAPI?【发布时间】：2012-01-3108:32:18【问题描述】：我需要创建一个天气小部件。小部件意味着它应该是显示我的天气详细信息的表格或div... 查看详情

使用 Google API Client，如何创建客户端

】使用GoogleAPIClient，如何创建客户端【英文标题】：WithGoogleAPIClient,howtocreateclient【发布时间】：2017-07-1311:28:55【问题描述】：我正在努力使用GoogleAPI客户端：https://github.com/google/google-api-ruby-client具体来说，我想通过GoogleAPI客户... 查看详情

如何使用辅助端点为 Angular 库创建 API

】如何使用辅助端点为Angular库创建API【英文标题】：HowtousesecondaryendpointstocreateAPIforAngularlibrary【发布时间】：2018-12-1316:10:30【问题描述】：场景：我使用ng-packagr创建了一个自定义UI库，导出了自定义components和一些模型类。问题... 查看详情