get Vue Webpack Cliのアキシオ経由でのルートリスト

Question

私はVue Webpack Cliプロジェクトでprerender-spa-pluginを使用しています。私はaxiosの呼び出しを介してルート配列のリストを取得することが可能である場合、私は思ったんだけど、この

... 
plugins: [ 
    ... 
    new PrerenderSpaPlugin(
    path.join(__dirname, '../dist'), 
    ['/', '/about', '/contact'], 
    { 
     captureAfterTime: 5000 
    } 
) 
] 

ようwebpack.prod.conf.jsにプラグインを登録してるのドキュメントからのように。 私は成功せず、次のことを試してみました：

var routes = axios.get('http://myapi.com/api').then(function (response) { 
    return response.map(function (response) { 
    return '/base/' + response.slug 
    }) 
}) 

plugins: [ 
    ... 
    new PrerenderSpaPlugin(
    path.join(__dirname, '../dist'), 
    routes, 
    { 
     captureAfterTime: 5000 
    } 
) 
] 

私のJavascriptの知識が、私はこの問題を解決することはできないんだけど悪いので。何かヒントありがとうございました。

敬具

Answer 1

WebPACKのは、あなたの設定がデフォルトで同期していると仮定しているためこれは、現在（確実に少なくとも仕事や）は動作しません。これを回避するには、Webpackのサポートasynchronous configurationを使用し、ルート要求後に解決された約束を返すことです。

async/await（ノード8+）をサポートする環境にいる場合は、async関数をエクスポートするのと同じくらい簡単です。それ以外の場合は、new Promiseを返す：

// webpack.conf.js 
module.exports = async function() { 
    const response = await axios.get('http://myapi.com/api') 
    const routes = response.map((response) => { 
    return '/base/' + response.slug 
    }) 

    return { 
    plugins: [ 
     // ... 
     new PrerenderSpaPlugin(
     path.join(__dirname, '../dist'), 
     routes, 
     { 
      captureAfterTime: 5000 
     } 
    ) 
    ] 
    } 
} 

ことができない場合は、あなたは常にこの要求を行うタスクを持つことができ、jsonファイルに書き込み、その後、あなたの設定でrequire('./route-response.json')。