nuxt 踩坑分享之 pages 命名

原由：掃碼後彈窗分城市（北京、上海）區分頁面，在進行命名定義時將 pages 掃碼後彈窗下的頁面命名爲：scan_app_pop 和 scan_app_popsh，然而在頁面上線後，發現上海的連接沒法正確顯示，頁面無內容。經排查發現是nuxt router 動態路由的一個問題 😅

Nuxt.js 依據 pages 目錄結構自動生成 vue-router 模塊的路由配置。
項目中頁面目錄結構以下圖所示，文件中定義紅色線框中的兩個文件，文件內爲不一樣內容。

該文件生成的對應的路由配置爲：

能夠看到路由配置中，兩個路徑後均有一個 :appsh 以及 :appbj 兩個參數

在運行時發現兩個頁面顯示的均爲第一個頁面的內容。

Nuxt.js 文檔裏有這樣的規定：

在 Nuxt.js 裏面定義帶參數的動態路由，須要建立對應的如下劃線做爲前綴的 Vue 文件 或 目錄。

因爲命名的規範問題，命名時帶有下劃線，致使 nuxt 按照參數來解析文件名，:appsh 以及 :appbj 表示該路由是可選的。在自動生成路由後，匹配到前面的scan，所以不會匹配後面這一項，位於前面的路由會覆蓋後面的路由，致使後面的頁面沒法顯示。

所以在利用 Nuxt.js 進行項目配置的時候命名時需注意儘可能避免使用下劃線命名！以避免產生未知的問題！