用vue-router路由靜態頁面

我對web開發相當陌生，我想知道是否有一種方法可以使用vue-router來路由帶有自己的樣式表和JavaScript的靜態網頁。用vue-router路由靜態頁面

比方說，我有一個名爲staticWebPage目錄包含：

一個index.html文件
含.js文件
和樣式包含目錄.css文件

的JavaScript

現在，我想將/mystaticwebpage映射到此index.html文件，以便它顯示特定的靜態網頁。

我想要做這樣的事情：

import VueRouter from 'vue-router' 
import AComponent from './components/AComponent.vue' 
import MyHtmlFile from './references/index.html' 

router.map({ 
    '/acomponent': { 
     component: AComponent 
    }, 
    'mystaticwebpage': { 
     component: MyHtmlFile 
    } 
})

當然，這並不工作，我只能在router.map引用Vue公司的組件。

有沒有辦法路由到該./staticWebPage/index.html文件使用/staticWebPage目錄中包含的所有.js和.css文件？

來源

2017-05-30 Randy

Mh，Vue路由器是一個客戶端路由器，所以根據定義它可能不會導致靜態頁面。 – Cobaltway

您是否認爲可能有解決方法，不使用Vue路由器？我只想把一個與我的Vue應用使用的域名相同的靜態頁面 – Randy

我認爲使用vue-router非常好，但這不是一個靜態頁面系統。 – Cobaltway

所以對於你的情況，你可以做一些使用Webpack的代碼分割功能。

更確切地說，你想要的可能是異步組件。因此，只有在訪問相應的頁面時，纔會加載組件定義中使用的代碼（和css）（包括您在其中包含的任何腳本）。

在大型應用中，我們可能需要將應用程序劃分成更小的塊，當它實際上是需要只能從服務器負載的組件。爲了簡化操作，Vue允許您將組件定義爲一個工廠函數，該函數異步解決您的組件定義。 Vue只會在實際需要渲染組件時觸發工廠函數，並將緩存未來重新渲染的結果。

設置起來可能有點困難，所以請參考VueJS文檔中的dedicated guide。

來源

2017-05-30 14:15:55 Cobaltway

請注意，它不允許你加載HTML文件，當然。但是你可以在組件模板中包含任何你想要的html。 – Cobaltway

用vue-router路由靜態頁面

回答

相關問題