Question

我想在Vue中使用async \ await。有order-list.vue，简而言之是：

getOrder: function () {
  return new Promise(function (resolve, reject) {
      setTimeout(() => {
          console.log('hello world');
          resolve(true)
      }, 2000)
  });
},
example: async() => {
  console.log('start');
  for (let i in this.orders) {
      await this.getOrder().then(
          console.log('loaded ' + i)
      )
  }
  console.log('finish');
}

这一切都将用于webpack。启动webpack时，我收到此消息

ERROR in ./erp/vue/order-list.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./erp/vue/order-list.vue?vue&type=script&lang=js&)

Module not found: Error: Can't resolve '@babel/runtime/regenerator' in '/Users/pankovalxndr/Sites/mysite/erp/vue'
 @ ./erp/vue/order-list.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./erp/vue/order-list.vue?vue&type=script&lang=js&) 1:0-61 141:13-32 146:28-47 156:21-40

package.json

这是怎么了？

"devDependencies": {
    "@babel/core": "^7.4.3",
    "@babel/plugin-transform-runtime": "^7.6.2",
    "@babel/preset-env": "^7.4.3",
    "autoprefixer": "^8.6.5",
    "babel-loader": "^8.0.0-beta.6",
    "babel-runtime": "^6.26.0",
    "gulp": "git://github.com/gulpjs/gulp.git#6d71a658c61edb3090221579d8f97dbe086ba2ed",
    "gulp-cheerio": "^0.6.3",
    "gulp-cssnano": "^2.1.2",
    "gulp-postcss": "^7.0.1",
    "gulp-print": "^5.0.2",
    "gulp-rename": "^1.4.0",
    "gulp-replace": "^0.6.1",
    "gulp-sass": "^3.1.0",
    "gulp-svg-sprite": "^1.5.0",
    "gulp-svgmin": "^1.2.4",
    "gulp-uglify": "^3.0.2",
    "gulp-watch": "^5.0.1",
    "vue-loader": "^15.7.2",
    "vue-style-loader": "^4.1.2",
    "vue-template-compiler": "^2.5.17",
    "webpack": "^4.41.2",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.9.0"
  }

我的.babelrc

这是怎么了？

{
  "presets": [
    "@babel/preset-env"
  ],
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "regenerator": true
      }
    ]
  ]
}

webpack文件

这是怎么了？

   
    module: {
        rules: [
            {
                test: /\.vue$/,
                use: 'vue-loader'
            },
            {
                test: /\.css$/,
                use: [
                    'vue-style-loader',
                    'css-loader'
                ]
            }, {
                test: /\.js$/,
                use: 'babel-loader'
            }

        ]
    },
    plugins: [
        new VueLoaderPlugin(),
    ]

如果我在等待状态下删除了函数，那么一切都会开始正常运行，这些东西在某些模块中并不是特别准确，

使用异步\在Vue中等待？

0 个答案: