gpt4 book ai didi

javascript - 我尝试用 Parcel 构建一个 vue 项目,但现在失败了……或者说,我遇到了一些错误

转载 作者:搜寻专家 更新时间:2023-10-30 22:48:04 25 4
gpt4 key购买 nike

我只是尝试构建一个 vue 项目并将目录结构设置为类似于 vue-cli 生成的项目。在使用 vue-router 函数后我得到了一些错误。错误是:

enter image description here

以下是我的目录结构:

- Parcel
- src
- components
- Index.vue
- router
- index.js
- App.vue
- main.js
- node_modules
- index.html
- package.json

为了看的更清楚,我把部分源码demo写了出来:

index.html

<body>
<div id="app"></div>
<script src="./src/main.js"></script>
</body>

src/main.js

import Vue from 'vue';
import router from './router/index.js'
import App from './App.vue'

Vue.config.productionTip = false
new Vue({
el: "#app",
router,
template: '<App/>',
components: { App }
})

src/App.vue

<template>
<div id="app">
<h1>App Page</h1>
<router-view></router-view>
</div>
</template>

router/index.js

import Vue from 'vue'
import Router from 'vue-router'
import Index from '../components/Index.vue'

Vue.use(Router);
export default new Router({
routes: [
{
path: '/',
component: Index
}
]
})

最佳答案

要使单个文件组件工作,您必须安装以下内容:

npm install @vue/component-compiler-utils vue-template-compiler --save-dev
npm install vue-hot-reload-api --save

插件https://github.com/BoltDoggy/parcel-plugin-vue不推荐,因为 parcel-bundler/parcel @1.7.0 现在支持 Vue。

如果您有兴趣,我为 Vue 和 Parcel 创建了一个简单的样板。 https://github.com/sorxrob/vue-parcel

关于javascript - 我尝试用 Parcel 构建一个 vue 项目,但现在失败了……或者说,我遇到了一些错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47766006/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com