我在这个结构中有一个 csv 文件
name,year,href,src
Parasite,2019,parasite-2019,film-poster/4/2/6/4/0/6/426406-parasite-0-460-0-690-crop.jpg
我想将此文件作为列表导入,每一行作为字典,如下所示:
[{'name':'Parasite','year':'2019','href':'parasite-2019','src':'film-poster/4/2/6/4/0/6/426406-parasite-0-460-0-690-crop.jpg'}]
我尝试使用import csv from './filmList.csv'
在 - 的里面<script>
标签,但这只会给我一个加载错误:
[plugin:vite:import-analysis] Failed to parse source for import analysis because the content contains invalid JS syntax. You may need to install appropriate plugins to handle the .csv file format.
Install @rollup/plugin-dsv https://www.npmjs.com/package/@rollup/plugin-dsv作为开发依赖项:
npm i -D @rollup/plugin-dsv
...并配置 Vite 以使用它:
// vite.config.js
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import dsv from '@rollup/plugin-dsv' ????
export default defineConfig({
plugins: [
vue(),
dsv(), ????
],
})
然后导入一个.csv
file 将生成对象数组,正如您所期望的:
<script>
// MyComponent.vue
import csv from './filmList.csv'
console.log(csv) // => [{'name':'Parasite','year':'2019','href':'parasite-2019','src':'film-poster/4/2/6/4/0/6/426406-parasite-0-460-0-690-crop.jpg'}]
</script>
demo https://stackblitz.com/edit/vue3-vite-load-csv?file=vite.config.js
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)