korrekte Weise, async zu verwenden/erwarten mit babel 6 und webpack

Question

Ich versuche gerade, async zu erforschen/erwarten. Wenn ich die Funktion aufrufen, habe ich dies in meiner Konsole:

Promise { <state>: "pending" } 

Hier mein webpack.conf.js ist:

var path = require("path"); 
var webpack = require('webpack'); 
var BundleTracker = require('webpack-bundle-tracker'); 

module.exports = { 
    devtool: 'eval', 
    entry: [ 
     'babel-regenerator-runtime', 
     './static/apps/app.jsx' 
    ], 
    output : { 
     path: __dirname, 
     filename: "./static/js/bundles/[name]-[hash].js" 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.jsx?$/, 
       loader: 'babel-loader', 
       exclude: /node_modules/, 
       query: { 
        plugins: [ 'transform-decorators-legacy', 'syntax-async-functions', 'transform-async-to-generator'], 
        presets: ['react', 'es2015', 'stage-0'] 
       } 
      } 
     ] 
    }, 
    plugins: process.env.NODE_ENV === 'production' ? [ 
     new webpack.optimize.DedupePlugin(), 
     new webpack.optimize.OccurrenceOrderPlugin(), 
     new webpack.NoErrorsPlugin(), 
     new webpack.optimize.UglifyJsPlugin({ 
     compress: { warnings: false }, 
      comments: false, 
      sourceMap: true, 
      mangle: true, 
      minimize: true 
    }) 
    ] : [new BundleTracker({filename: './webpack-stats.json'}), new webpack.NoErrorsPlugin()] 
}; 

und meine Funktion:

export async function x() { 
    return await (5 * 5); 
} 

und die gerufene Methode :

import {x} from '../utils/pgp.js'; 

..... 
componentWillMount(){ 
     console.log(x()); 
    } 
..... 

Answer 1

Das Ergebnis von return await wird ein Versprechen sein, genau wie es in Ihrem Konsolenprotokoll steht. Um auf den aufgelösten Wert zuzugreifen, müssen Sie Ihren Anruf mit then verketten, oder Sie müssen sich in einer anderen asynchronen Funktion befinden, die die Verwendung von await auflösen kann.

async function x() { 
    return await 5 * 5 
} 

// using `.then` 
x().then(value => console.log(value)) 

// inside another async function 
async function main() { 
    let value = await x() 
    console.log(value) 
} 

main()