2017-08-20 396 views
-1

我想用vue2分析我的項目的當前路由器配置。因爲我想用cli來生成一個vue組件。在此之前,我必須加載當前的路由註冊信息。但是當我在路由器目錄下需要router.js時。節點拋出SyntaxError: Unexpected token import。我嘗試了很多方法來解決它,但他們沒有奏效。請告訴我加載我的路由器配置的正確方法。謝謝!如何使用node.js加載vue項目的.vue文件

 

    //to load router config 
    const routerPath = path.join(process.cwd(), 'src', 'router', 'index.js'); 

    if (existsSync(routerPath)) { 
     routes = require(routerPath) 
    } 

    //error 
    import Vue from "vue"; 
    ^^^^^^ 

    SyntaxError: Unexpected token import 
     at Object. (/Users/mosx/projects/mjb-cli/lib/check-components.js:28:33) 
     at Module._compile (module.js:570:32) 
     at Object.Module._extensions..js (module.js:579:10) 
     at Module.load (module.js:487:32) 
     at tryModuleLoad (module.js:446:12) 
     at Function.Module._load (module.js:438:3) 
     at Module.require (module.js:497:17) 
     at require (internal/module.js:20:19) 
     at Object. (/Users/mosx/projects/mjb-cli/bin/mjb-component:12:25) 
     at Module._compile (module.js:570:32) 

    // path/to/router/index.js 
    import Router from "vue-router"; 
    import Hello from "../components/Hello.vue"; 

    Vue.use(Router); 

    export default new Router({ 
     routes: [ 
      { 
       path: '/', 
       name: 'Hello', 
       component: Hello, 
       children: [ 
        { 
         path: 'child', 
         name: 'child', 
         component: Hello 
        } 
       ] 
      } 

     ] 
    }) 

+3

請發佈與此相關的問題 – divine

+0

@divine的代碼,很抱歉之前沒有代碼,現在我加入它 – ifmos

回答

0

雖然張貼在問題的代碼的模塊性是值得懷疑的, 我相信我的回答能解決你所面臨的問題。
這不用..

要建立下面的代碼,我利用VUE樣板

vue init webpack-simple vue-cli 

然後,我安裝VUE路由器包

npm install --save vue-router 

Main.js文件

import Vue from 'vue'; 
import {routes} from './routes'; 
import VueRouter from 'vue-router'; 
import App from './App.vue'; 

Vue.use(VueRouter); 
const router = new VueRouter({ 
    routes : routes, 
    mode : 'history' 
}) 

new Vue({ 
    el: '#app', 
    router : router, 
    render: h => h(App) 
}) 

Route.js文件

import Cricket from './components/Cricket.vue'; 
import Football from './components/Football.vue'; 
import Basketball from './components/Basketball.vue'; 
import Sports from './components/Sports.vue'; 
export const routes = [ 
    { 
     path: '/cricket', 
     component: Cricket 
    }, 
    { 
     path: '/football', 
     component: Football 
    }, 
    { 
     path: '/basketball', 
     component: Basketball 
    }, 
    { 
     path: '', 
     component: Sports 
    } 
];