Javascript 未找到ag grid vue模块，即使它是'；节点_模块中的s

我正在逐步遵循Vue.js AgGrid入门指南：

在添加

部件并保存后，我立即收到以下错误：

ERROR  Failed to compile with 1 errors                              12:01:18 PM

This dependency was not found:

* ag-grid-vue in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&

To install it, you can run: npm install --save ag-grid-vue
Type checking in progress...
No type errors found
Version: typescript 3.5.3
Time: 1125ms

问题是，我已经使用指南中的命令安装了它：

npm install --save ag-grid-community ag-grid-vue vue-property-decorator

我已经检查了node_模块，所有的东西似乎都在那里。 以下是我目前在App.vue中的代码：

<template>
    <ag-grid-vue style="width: 500px; height: 500px;"
                 class="ag-theme-balham"
                 :columnDefs="columnDefs"
                 :rowData="rowData">
    </ag-grid-vue>
</template>

<style lang="scss">
  @import "../node_modules/ag-grid-community/dist/styles/ag-grid.css";
  @import "../node_modules/ag-grid-community/dist/styles/ag-theme-balham.css";
</style>

<script>
    import {AgGridVue} from "ag-grid-vue";

    export default {
        name: 'App',
        data() {
            return {
                columnDefs: null,
                rowData: null
            }
        },
        components: {
            AgGridVue
        },
        beforeMount() {
            this.columnDefs = [
                {headerName: 'Make', field: 'make'},
                {headerName: 'Model', field: 'model'},
                {headerName: 'Price', field: 'price'}
            ];

            this.rowData = [
                {make: 'Toyota', model: 'Celica', price: 35000},
                {make: 'Ford', model: 'Mondeo', price: 32000},
                {make: 'Porsche', model: 'Boxter', price: 72000}
            ];
        }
    }
</script>

@导入“./node_modules/ag grid community/dist/styles/ag grid.css”；
@导入“./node_modules/ag grid community/dist/styles/ag theme balham.css”；
从“ag网格vue”导入{AgGridVue}；
导出默认值{
名称：“应用程序”，
数据（）{
返回{
columnDefs:null，
行数据：空
}
},
组成部分：{
阿格里德维
},
beforeMount（）{
this.columnDefs=[
{headerName:'Make'，field:'Make'}，
{headerName:'Model'，字段：'Model'}，
{headerName:'Price'，字段：'Price'}
];
this.rowData=[
{品牌：'Toyota'，型号：'Celica'，价格：35000}，
{品牌：福特，型号：蒙迪欧，价格：32000}，
{品牌：'Porsche'，型号：'Boxter'，价格：72000}
];
}
}

---

知道发生了什么吗？在MacOS Catalina上，如果需要的话，并使用最新版本的Node（今天早上刚刚下载）。我还尝试过卸载和重新安装node（完全删除所有隐藏的节点文件夹和内容，然后从站点重新安装）。

看起来ag grid getting started文档已经过时。现在要安装的正确软件包基于模块

例如，在

package.json中的依赖项下：

"@ag-grid-community/all-modules": "~22.1.0",
"@ag-grid-community/client-side-row-model": "~22.1.0",
"@ag-grid-community/core": "~22.1.0",
"@ag-grid-community/csv-export": "~22.1.0",
"@ag-grid-community/infinite-row-model": "~22.1.0",
"@ag-grid-community/vue": "~22.1.0",
"@ag-grid-enterprise/all-modules": "~22.1.0",

然后在组件的
中：

import {AgGridVue} from "@ag-grid-community/vue";
import {AllCommunityModules} from '@ag-grid-community/all-modules';

在
导出默认值下的“数据”中：

data() {
    return {
        columnDefs: null,
        rowData: null,
        modules: AllCommunityModules
    }
},

最后在
中：

<template>
    <ag-grid-vue style="width: 500px; height: 500px;"
                  class="ag-theme-balham"
                 :columnDefs="columnDefs"
                 :rowData="rowData"
                 :modules="modules">
    </ag-grid-vue>
</template>


为了这个。他们真的需要更新他们的入门页面