2017-06-04 13 views
1

REST APIを使用してサーバーと通信する必要がある新しいWebAppを作成しています。 Swaggerを使用してREST APIを定義し、サーバーとJavascriptクライアント(ブラウザで実行される単純なWebアプリケーション)のコードを生成したいと考えています。webpackでSwaggerで生成されたコードをバンドルする方法

(Javaサーブレットを使用して)サーバーを実装できました。

私はJavascriptクライアント用のコードを生成しましたが、動作させることができません(Javascript、webpack、nom ...の初心者です)。

webappによってロードされる.jsファイルを生成するにはwebpackを使用したいと思います。この.jsにはswaggerによって生成されたコードとSwagger(... UIを使用してクエリを送信するコードが含まれます! )。ここで

は私のプロジェクトの組織です:

/ 
- package.json 
- node_modules (modules installed with npm) 
- src 
    ---> /main.js (code I have written to send the REST API query using Swagger generated code) 
    ---> /index.js (code generated by Swagger) 
    ---> /ApiClient.js (code generated by Swagger) 
    ---> /api (folder that contains code generated by Swagger) 
    ---> /model (folder that contains code generated by Swagger) 
- webpack.config.js 
- runTest ---> - bundle.js (generated by webpack) ---> - index.html 

私はWebPACKのコマンドを実行すると、私は若干の誤差が出る:

./node_modules/.bin/webpack --config webpack.config.js

Hash: a77095b323ec225f9b17 Version: webpack 2.6.1 Time: 396ms Asset Size Chunks Chunk Names bundle.js 6.48 kB 0 [emitted] main [0] ./src/index.js 2.61 kB {0} [built] [1] ./src/main.js 212 bytes {0} [built]

ERROR in ./src/index.js Module not found: Error: Can't resolve 'ApiClient' in '/Users/sebastien/Documents/Javascript/Stackoverflow/superagenttest/src' @ ./src/index.js 17:4-86 @ ./src/main.js

ERROR in ./src/index.js Module not found: Error: Can't resolve 'model/Error' in '/Users/sebastien/Documents/Javascript/Stackoverflow/superagenttest/src' @ ./src/index.js 17:4-86 @ ./src/main.js

私main.jsには、次のものが含まれています

var MyMetadataApi = require('./index'); // See note below*. 
var xxxSvc = new MyMetadataApi.defaultApi(); // Allocate the API class we're going to use. 
var zzz = xxxSvc.myFieldsGet(); // Invoke the service. 

index.js(Swaggerが生成したもの)

(function(factory) { 
    if (typeof define === 'function' && define.amd) { 
    // AMD. Register as an anonymous module. 
    define(['ApiClient', 'model/Error', 'model/MyField', 'api/DefaultApi'], factory); 
    } else if (typeof module === 'object' && module.exports) { 
    // CommonJS-like environments that support module.exports, like Node. 
    module.exports = factory(require('./ApiClient'), require('./model/Error'), require('./model/MyField'), require('./api/DefaultApi')); 
    } 
}(function(ApiClient, Error, MyField, DefaultApi) { 
    'use strict'; 

    /** 
    * get_My_fields.<br> 
    * The <code>index</code> module provides access to constructors for all the classes which comprise the public API. 
    * <p> 
    * An AMD (recommended!) or CommonJS application will generally do something equivalent to the following: 
    * <pre> 
    * var MyMetadataApi = require('index'); // See note below*. 
    * var xxxSvc = new MyMetadataApi.XxxApi(); // Allocate the API class we're going to use. 
    * var yyyModel = new MyMetadataApi.Yyy(); // Construct a model instance. 
    * yyyModel.someProperty = 'someValue'; 
    * ... 
    * var zzz = xxxSvc.doSomething(yyyModel); // Invoke the service. 
    * ... 
    * </pre> 
    * <em>*NOTE: For a top-level AMD script, use require(['index'], function(){...}) 
    * and put the application logic within the callback function.</em> 
    * </p> 
    * <p> 
    * A non-AMD browser application (discouraged) might do something like this: 
    * <pre> 
    * var xxxSvc = new MyMetadataApi.XxxApi(); // Allocate the API class we're going to use. 
    * var yyy = new MyMetadataApi.Yyy(); // Construct a model instance. 
    * yyyModel.someProperty = 'someValue'; 
    * ... 
    * var zzz = xxxSvc.doSomething(yyyModel); // Invoke the service. 
    * ... 
    * </pre> 
    * </p> 
    * @module index 
    * @version 1.0.0 
    */ 
    var exports = { 
    /** 
    * The ApiClient constructor. 
    * @property {module:ApiClient} 
    */ 
    ApiClient: ApiClient, 
    /** 
    * The Error model constructor. 
    * @property {module:model/Error} 
    */ 
    Error: Error, 
    /** 
    * The MyField model constructor. 
    * @property {module:model/MyField} 
    */ 
    MyField: MyField, 
    /** 
    * The DefaultApi service constructor. 
    * @property {module:api/DefaultApi} 
    */ 
    DefaultApi: DefaultApi 
    }; 

    return exports; 
})); 

Swaggerと私のmain.jsによって生成されたコードを正常に含むbundle.jsをwebpackで生成するにはどうすればよいですか?

私はimport/requireで失われています... require()をいくつかのインポートで置き換えようとしましたが、成功しませんでした(またはindex.jsを読むことができますが、 ApiClient.jsをインポートできません)。 AMDとCommonJSのアプリケーションは、Swaggerによって生成されたコードで記述されていますか?

すべてのヘルプは、私は解決策を見つけた;-) おかげで、

セバスチャン

答えて

1

をいただければ幸い、私は私のwebpack.config.jsに以下を追加する必要があります

module: { 
    rules: [ 
    { 
     test: /my_client\/.*\.js$/, 
     use: 'imports-loader?define=>false' 
    } 
    ] 
}, 
node: { 
    fs: 'empty' 
} 

I swagger-codegen GitHubリポジトリでこの修正が見つかりました:https://github.com/swagger-api/swagger-codegen/issues/3336

関連する問題