Javascript “替代方案”;组件:()=>;进口;在VueJs路由中

Javascript “替代方案”;组件:()=>;进口;在VueJs路由中,javascript,vue.js,import,routes,router,Javascript,Vue.js,Import,Routes,Router,我在线下载了一个模板,以便更好地理解VueJs,并创建了一个web应用程序。然而,我有一个路由问题。我的路由器的index.js中有一个导入路径的函数。由于某些网页包问题,导入语法似乎有缺陷。我尝试了很多不同的方法,但无法修复错误,因此我想为import语法找到解决方法 这是我的路由器index.js代码 import Vue from 'vue' import VueAnalytics from 'vue-analytics' import Router from 'vue-router' i

我在线下载了一个模板,以便更好地理解VueJs,并创建了一个web应用程序。然而,我有一个路由问题。我的路由器的index.js中有一个导入路径的函数。由于某些网页包问题,导入语法似乎有缺陷。我尝试了很多不同的方法,但无法修复错误,因此我想为
import
语法找到解决方法

这是我的路由器index.js代码

import Vue from 'vue'
import VueAnalytics from 'vue-analytics'
import Router from 'vue-router'
import Meta from 'vue-meta'

// Routes
import paths from './paths'
// import views from './views'

function route (path, view, name) {
  return {
    name: name || view,
    path,
    component: () => import(
      `../views/${view}.vue`
    )
  }
}

Vue.use(Router)

// Create a new router
const router = new Router({
  mode: 'history',
  routes: paths.map(path => route(path.path, path.view, path.name)).concat([
    { path: '*', redirect: '/home' }
  ]),
  scrollBehavior (to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    }
    if (to.hash) {
      return { selector: to.hash }
    }
    return { x: 0, y: 0 }
  }
})

Vue.use(Meta)

// Bootstrap Analytics
// Set in .env
// https://github.com/MatteoGabriele/vue-analytics
if (process.env.GOOGLE_ANALYTICS) {
  Vue.use(VueAnalytics, {
    id: process.env.GOOGLE_ANALYTICS,
    router,
    autoTracking: {
      page: process.env.NODE_ENV !== 'development'
    }
  })
}

export default router
当我尝试构建它时,会出现一个错误,错误是:

ERROR in ./src/router/index.js
Module build failed: SyntaxError: C:/djangoProjects/martin - Copy/martin/src/router/index.js: Unexpected token (15:21)

语法错误在第行(15:21),在
组件:()=>导入的
路由
函数中(
行,并且完全在
import
上。修复此问题是一件痛苦的事情,因此我想知道,如果不使用
import
语法,是否有解决方法?

如果我没记错的话,您需要一个巴贝尔插件来处理动态导入

退房:

  • 运行
    npm安装@babel/plugin语法动态导入
  • 创建或打开
  • {
        "plugins": ["@babel/plugin-syntax-dynamic-import"]
    }