[英]ag-grid-vue module not found even though it's in node_modules
I'm following the Vue.js AgGrid getting started guide, step by step: https://www.ag-grid.com/vuejs-grid/我正在遵循 Vue.js AgGrid 入门指南,一步一步: https ://www.ag-grid.com/vuejs-grid/
As soon as I add the <script>
part and save, I get the following error:一旦我添加
<script>
部分并保存,我就会收到以下错误:
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
The thing is that I've already installed it, using the command in the guide:问题是我已经安装了它,使用指南中的命令:
npm install --save ag-grid-community ag-grid-vue vue-property-decorator
I've checked in node_modules and everything seems to be there.我已经检查了 node_modules,一切似乎都在那里。 Here's the code I have in App.vue so far:
到目前为止,这是我在 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>
Any idea what's going on?知道发生了什么吗? On MacOS Catalina if that matters, and using the latest LTS version of Node (just downloaded it this morning).
在 MacOS Catalina 上,如果这很重要,并使用最新的 LTS 版本的 Node(今天早上刚下载)。 I've also tried uninstalling and reinstalling node (the "full" way that removes all the hidden node folders and stuff too, then reinstalling from the site).
我还尝试卸载和重新安装节点(“完整”方式也删除所有隐藏的节点文件夹和内容,然后从站点重新安装)。
Looks as though the ag-grid getting started documentation is out of date.看起来好像 ag-grid 入门文档已经过时了。 The proper packages to install now are based on modules.
现在要安装的正确软件包基于模块。
Eg under dependencies in package.json
:例如在
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",
Then in the component's <script>
:然后在组件的
<script>
:
import {AgGridVue} from "@ag-grid-community/vue";
import {AllCommunityModules} from '@ag-grid-community/all-modules';
In "data" under export default
:在
export default
下的“数据”中:
data() {
return {
columnDefs: null,
rowData: null,
modules: AllCommunityModules
}
},
And finally in the <template>
:最后在
<template>
:
<template>
<ag-grid-vue style="width: 500px; height: 500px;"
class="ag-theme-balham"
:columnDefs="columnDefs"
:rowData="rowData"
:modules="modules">
</ag-grid-vue>
</template>
Got lots of help from https://www.ag-grid.com/javascript-grid-modules/#installing-ag-grid-modules for this.从https://www.ag-grid.com/javascript-grid-modules/#installing-ag-grid-modules得到了很多帮助。 They really need to update their getting started pages!
他们真的需要更新他们的入门页面!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.