項目創建完畢後出現一下的頁面：

出現這樣的頁面根本不中啊，怎麽換成我的頁面，好的，開始看看項目結構：

這都是什麽鬼，我在哪裏寫代碼，在哪裏修改文件，怎麽辦？感覺index.html挺熟悉打開看看：

看起來稀松平常啊，就是一個html頁面，裏面什麽都沒有，只有一個div容器並且id是app，好吧換個再看看。打開src看看，

直覺告訴我，有點像，打開main.js看看，估計裏面寫的是一些入口函數什麽的：

前幾行導入了不少模塊，其中router是我們在創建項目時候選擇安裝的，如果當時選擇的是不安裝，則不會出現這裏的router，這是個路由模塊，先不管了，看看他代碼：

Vue.config.productionTip = false   這是個什麽鬼，猜測一下估計是個判斷生產環境用的，不用管了，目的不在這裏。

緊接著出現如下代碼段，好像是有點意思的：

/* eslint-disable no-new */
new Vue({
  el: ‘#app‘,
  router,
  components: { App },
  template: ‘<App/>‘
})

這裏new了一個對象，對象屬性裏面用{}又創建了一個對象，對象裏面有不少屬性，這裏有個el，el應該是element元素的意思。這裏有個#app，跟前面看到的index.html中的id一致，猜測應該是該main.js文件與html文件關聯起來了，至於怎麽關聯的不用管了，我們目的是怎麽創建自己的頁面。好的繼續看App.vue文件。

文件剛開始有個template標簽，表示沒見過。應該是vue自定義的模板標簽，緊接著是一個圖片，把這個圖片刪除了會怎麽樣，試試。刪除後查看一下頁面效果。

發現原來存在的那張圖片沒了，好事情，找到可以修改的地方了。自己添加一句話試試：

--------------------------------------------------------------------------------------------------------------------------------------------------------------

看到自己添加的話已經出來了：秋名山上行人稀， 常有車手較高低。 如今車道依舊在， 不見當年老司機。 好詩句！

好的差不多了，再看看其他的文件，看看下面的超鏈接怎麽去掉。進入到router文件夾看看：

這個目錄真簡單就一個index.js文件，打開看看：

直覺告訴我這是路由配置文件，應該是在這裏面配置頁面路由。裏面竟然有HelloWorld，這是個什麽東西，先不用管，我們看看其他的文件夾裏有沒有helloworld。打開components文件夾看看：

說曹操曹操到，這裏就存在了一個HelloWorld.vue文件，挺好，打開看看，對了，components是組件的意思。

好的，發現了若幹超鏈接，鏈接文本與頁面上的文字一致，刪除一下看看。

變幹凈多了，沒有那麽多惡心的鏈接和圖片了，幹幹靜靜的，爽。記住了這裏也可以修改了。

此時我們整理一下思路，看看哪裏可以修改:

1 App.vue

2 HelloWorld.vue

暫時就知道這倆可以修改了。

vue項目修改