vue.js 使用组件自定义布局

gzszwxb4 于 2023-04-21 发布在 Vue.js

关注(0)|答案(1)|浏览(262)

我用npm init directus-extension为directus生成了一个自定义布局扩展。这工作正常，我可以构建一个index.js，我可以安装在我的本地directus应用程序中。但是当我想使用layout.vue文件中的组件时（在本例中为ProblemCard），运行构建时会出现以下错误：

✖ Failed
[RollupError] Could not resolve "./ProblemCard" from "src/layout.vue?vue&type=script&lang.js"

C:\Users\Martin\Documents\GitHub\systainchange\directus-extension-preflight-dashboard_old\src\layout.vue?vue&type=script&lang.js
RollupError: Could not resolve "./ProblemCard" from "src/layout.vue?vue&type=script&lang.js"
    at error (C:\Users\Martin\Documents\GitHub\systainchange\directus-extension-preflight-dashboard_old\node_modules@directus\extensions-sdk\node_modules\rollup\dist\shared\rollup.js:271:30)
    at ModuleLoader.handleInvalidResolvedId (C:\Users\Martin\Documents\GitHub\systainchange\directus-extension-preflight-dashboard_old\node_modules@directus\extensions-sdk\node_modules\rollup\dist\shared\rollup.js:24275:24)
    at C:\Users\Martin\Documents\GitHub\systainchange\directus-extension-preflight-dashboard_old\node_modules@directus\extensions-sdk\node_modules\rollup\dist\shared\rollup.js:24237:26

任何帮助或想法，我如何可以解决这个问题？是否有可能使用组件在自定义布局？

vue.js

来源：https://stackoverflow.com/questions/76021044/custom-layout-using-components

1条答案

按热度按时间

l0oc07j21#

上面提到的directus使用Vite进行翻译。请看这里：
https://github.com/directus/examples/blob/main/vue/package.json
因此，将文件导入到Vite时会出现问题。

Vite -错误：`Could not resolve XY file`

Vite中的Could not resolve错误消息的含义是它找不到所需的文件或模块。这可能是因为您使用了错误的文件路径，或者项目中缺少模块或文件。

Vite -如何导入`*.vue`文件

Vite中特意删除了无扩展导入，vue-cli中也遵循了这一点。
正确的导入方式始终包括扩展名！
例如Page.vue导入

// Not working !!!
import Page from "Page" // don't use this

// Successfully !!!
import Page from "Page.vue"

你可以在这里阅读更多关于这个问题：
https://github.com/vitejs/vite/issues/178

赞(0）回复(0）举报 2023-04-21

我来回答

vue.js 使用组件自定义布局

1条答案

Vite -错误：`Could not resolve XY file`

Vite -如何导入`*.vue`文件

相关问题

热门标签

最新问答

vue.js 使用组件自定义布局

1条答案

Vite -错误：Could not resolve XY file

Vite -如何导入*.vue文件

相关问题

热门标签

最新问答

Vite -错误：`Could not resolve XY file`

Vite -如何导入`*.vue`文件