一、首先第一確定是要有Node.js及npm這個很少說了
二、安裝腳手架css
此時能夠直接瀏覽
-可是如今確定有不少小白想將他發佈到gitHub上並能夠瀏覽,使用vue全家桶製做本身的博客。html
如今就有我來講說如何講vue項目發佈到github上vue
一、你們都知道使用npm run build
進行打包,這個時候你直接打開dist/
下的index.html
,會發現文件能夠打開,可是全部的js,css,img
等路徑有問題是指向根目錄的,此時須要修改config/index.js
裏的assetsPublicPath
的字段,初始項目是/
他是指向項目根目錄的也是爲何會出現錯誤,這時改成./
webpack
build: { env: require('./prod.env'), index: path.resolve(__dirname, '../dist/index.html'), assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath: './', productionSourceMap: true, // Gzip off by default as many popular static hosts such as // Surge or Netlify already gzip all static assets for you. // Before setting to `true`, make sure to: // npm install --save-dev compression-webpack-plugin productionGzip: false, productionGzipExtensions: ['js', 'css'], // Run the build command with an extra argument to // View the bundle analyzer report after build finishes: // `npm run build --report` // Set to `true` or `false` to always turn it on or off bundleAnalyzerReport: process.env.npm_config_report }
在從dist根目錄打開index
文件就能夠訪問了。git
一、首頁建立一個倉庫,此處直接忽略
二、在這裏選擇master或者/doc 上傳代碼到master
三、上面有一行域名就是你本身的頁面能夠看到本身發佈的項目github
一、這個時候就能夠瀏覽本身的項目了,可是web
username.github.io/xxx/dist 這樣的地址着實不是很美觀,你們能夠去阿里雲上,本身買個域名,解析一下,網上都有,能夠進行自定義的域名,來製做的本身的博客,代碼部署到github上。這篇文章這裏就先不作講解了,有想使用自定義域名,也能夠私信我。
這裏發佈頁面,其實最主要的時候坑是路徑問題,須要修改配置文件,你們沒事能夠多多瀏覽文檔瞭解vue的總體架構邏輯,後續再給你們帶來框架從入門到放棄。vue-cli
項目地址:
https://github.com/zhengjianl...npm
後續會就在這個目錄一步一步拆分給你們帶來如何使用vue2全家桶+webpack2構建一個博客