vue-cli打包

vue有本身的配套工具。

而vue-cli能夠很方便自動架構vue的東西。

當使用vue-cli開發完上線時，可使用npm run build 簡單的打包。

打包的文件都在dist裏，直接把這個文件裏的文件上線便可。

打包已經把文件壓縮和合並，還有文件名哈希等處理，因此通常默認打包方式會使文件難以閱讀

，這樣也能夠防止被別人簡單的，閱讀，就是不利於瀏覽器線上排查問題，但這樣可使用前端日誌等方式解決。

文件名哈希，便於靜態文件不會存在緩存等問題。

 

若是須要測試打包文件，能夠編寫一個簡單的node服務文件。

var express = require('express');
var config = require('./config/index');

var port = process.env.PORT || config.build.port;

var app = express();

var router = express.Router();

router.get('/', function(req, res, next) {
  req.url = '/index.html';
  next();
});
app.use(router);
app.use(express.static('./dist'));

/* mockJs--模擬數據獲取 */
const data = require('./data.json');
const apiRouter = express.Router();

apiRouter.get('/seller', function (req, res, next) {
  res.send({
    errno: 0,
    data: data.seller
  });
});

apiRouter.get('/goods', function (req, res, next) {
  res.send({errno: 0, data: data.goods});
});

apiRouter.get('/ratings', function (req, res, next) {
  res.send({errno: 0, data: data.ratings});
});

app.use('/app', apiRouter);

/* 監聽端口 */
module.exports = app.listen(port, function(err) {
  if (err) {
    console.log(err);
    return false;
  }
  console.log('Listen at http://localhost:' + port + '\n');
});