node 本地部署vue项目

以express为例：

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var history = require('connect-history-api-fallback');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/',history());
// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});
app.listen(8000,function(){
	console.log('启动成功');
})
module.exports = app;

如果路由配置了history模式，则需要引入connect-history-api-fallback包 调用如下命令

npm install --save connect-history-api-fallback

在public下新建一个文件夹order,把打包后的static文件夹和index.html放入order中，在vue router文件下的index.js中加入

base: '/order/',

router.js配置

import Vue from 'vue'
import Router from 'vue-router'
import store from '../store/store'

import home from '@/page/home'
import shopdetail from '@/page/shopdetail'
import shopcar from '@/page/shopcar'
import result from '@/page/result'
import login from '@/page/login'
import tab from '@/page/tab'
import message from '@/page/message'
import announce from '@/page/announce'
import announcedetail from '@/page/announcedetail'
import about from '@/page/about'
import orderDetail from '@/page/orderDetail'
import err from '@/page/err'

Vue.use(Router)

const router =  new Router({
 	mode: 'history',
	base: '/order/',
  routes: [
  	{
      path:'/login',//登陆
      name:'login',
      component: login,
    },
    {
      path: '/',//商品列表
      name: 'home',
      component: home,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/shopdetail',//商品详情
      name:'shopdetail',
      component: shopdetail,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/shopcar',//购物车
      name:'shopcar',
      component: shopcar,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/result',//结算
      name:'result',
      component: result,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/tab',//订单，地址，库存组件切换
      name:'tab',
      component: tab,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/message',//我的消息
      name:'message',
      component: message,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/announce',//公告
      name:'announce',
      component: announce,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/announcedetail',//公告详情
      name:'announcedetail',
      component: announcedetail,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/about',//联系我们
      name:'about',
      component: about,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'/orderDetail',//订单详情
      name:'orderDetail',
      component: orderDetail,
      meta:{
        requireAuth:true,//添加该字段，表示进入这个路由是需要登录的。
    	}
    },
    {
      path:'*',//订单详情
      name:'err',
      component: err
    },
  ]
})
if (window.sessionStorage.getItem('token')) {
  store.commit('setkoken', window.sessionStorage.getItem('token'));
}
router.beforeEach((to,from,next)=>{
		if(to.path === '/login'){
			store.commit("setNav",'none');
		}
    if(to.meta.requireAuth){//判断该路由是否需要登录权限。
        if(store.state.token){//通过vuex state获取当前的token是否存在。
        		store.commit("setNav",'block');
            next();
        }else{
        		
            next({
                path:'/login',
                query:{redirect:to.fullPath}//将跳转的路由path作为参数，登陆成功后跳转到该路由
            })
        }
    }else{
        next();
    }
})

export default router;

完成。