我想在我的自定义vue应用程序中尝试延迟加载模块,但我遇到了一个问题。
基本上,我的路由是从数据库设置的,其中一条是显示程序的路径(对于孩子们)。在这个程序中,我加载了几个组件,如客户列表,同意等等。
目前,我喜欢它:
<div role="tabpanel" class="tab-pane" :class="{'active': current_tab == 'consent'}" id="consent" v-if="displayConsentComponent">
<consent v-model="consents" :edit="edit"></consent>
</div>
// and they are imported like so:
<script>
import Consent from './_consents';
import AssignedStaff from './_assigned-staff';
......
export default {
components:{
Consent,
AssignedStaff,
.....
},
data(){
return {
..........
}
}
}
</script>
但是想像你一样适应它,所以我改成了它:
<div role="tabpanel" class="tab-pane" :class="{'active': current_tab == 'consent'}" id="consent" v-if="displayConsentComponent">
<consent v-model="consents" :edit="edit"></consent>
</div>
// and they are imported like so:
<script>
const Consent = () => import('./_consents');
const AssignedStaff = () => import('./_assigned-staff');
......
export default {
components:{
Consent,
AssignedStaff,
.....
},
data(){
return {
..........
}
}
}
</script>
但不幸的是我的整个应用程序无法构建和运行(如果我重建它),否则会出现此错误:
in ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/components/programs/program.vue Module parse failed: E:\Gabi\khcc-crm-playground\node_modules\babel-loader\lib\index.js!E:\Gabi\khcc-crm-playground\node_modules\vue-loader\lib\selector.js?type=script&index=0!E:\Gabi\khcc-crm-playground\src\components\programs\program.vue
Unexpected token (58:8) You may need an appropriate loader to handle this file type. SyntaxError: Unexpected token (58:8) at Parser.pp$4.raise (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:2221:15) at Parser.pp.unexpected (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:603:10) at Parser.pp$3.parseExprAtom (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1822:12) at Parser.pp$3.parseExprSubscripts (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1715:21) at Parser.pp$3.parseMaybeUnary (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1692:19) at Parser.pp$3.parseExprOps (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1637:21) at Parser.pp$3.parseMaybeConditional (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1620:21) at Parser.pp$3.parseMaybeAssign (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1597:21) at Parser.pp$3.parseExpression (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1573:21) at Parser.pp$1.parseReturnStatement (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:839:33) at Parser.pp$1.parseStatement (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:699:34) at Parser.pp$1.parseBlock (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:981:25) at Parser.pp$3.parseFunctionBody (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:2105:24) at Parser.pp$1.parseFunction (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1065:10) at Parser.pp$3.parseExprAtom (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1810:19) at Parser.pp$3.parseExprSubscripts (E:\Gabi\khcc-crm-playground\node_modules\acorn\dist\acorn.js:1715:21) @ ./src/components/programs/program.vue 3:2-107
我已经更新了我的节点包,包括vue到最新版本(2.5.1X,如果我没记错的话),但无济于事。有人可以帮我解决一些想法吗?
非常感谢, 加布里埃尔
答案 0 :(得分:0)
也许您需要将异步组件移至components
。
您可以访问此处以了解更多信息:
https://vuejs.org/v2/guide/components-dynamic-async.html#Async-Components
<script>
export default {
components:{
Consent: () => import('./_consents'),
AssignedStaff: () => import('./_assigned-staff'),
.....
},
data(){
return {
..........
}
}
}
</script>