在Cloud 9中使用Vue Cli 3

前陣子看到Vue Cli 3出了,就很開心的在Cloud 9中試玩看看,沒想到按照官網中的指令,開了一個新的專案,然後使用指令npm run serve,打開開發模式,竟然出現Invalid Host header,上網查了半天,才知道要在vue.config.js,設定一些東西才可以,vue.config.js在Vue Cli 3的預設專案裡面是沒有這個檔案的,要自己創建在根目錄下會自動載入設定,下面是我的vue.config.js的設定

module.exports = {
  devServer: {
    host: '0.0.0.0',
    port: 8080,
    disableHostCheck: true,
  }
}

一定要設定disableHostCheck: true才可以跑

另外在Vue Cli 3的預設專案裡面,好像也沒有安裝vue-router和vuex,我看別人的文章都可以選,不知道為什麼我的都沒有,要自己安裝,可以用vue這個指令做安裝,會自動產生相關的檔案

vue add router
vue add vuex

還有新版的UI圖形介面,在cloud 9中也不能用,改天有找到解決方法再來寫

Leave a Reply

你的電子郵件位址並不會被公開。