vue打包

vue打包

在vue项目中，我们一般使用npm run build打包项目。打包项目后，出现一个 dist 文件夹，但是再次在本地浏览项目时会出现空白页面，从而部署到服务器的项目出现相同问题。
因此，要保证项目正常浏览，需做一些如下配置。

1.与src同级创建一个vue.config.js文件，放置以下内容：

module.exports = {
  publicPath: './',
  outputDir: 'dist',
  assetsDir: 'static'
}

2.修改vue项目，src -> router -> index.js 文件下部分代码如下：

const router = new VueRouter({
  mode: 'hash',
  base: process.env.BASE_URL,
  routes
})

即将原来的 history 路由改为 hash 路由

3.再次使用 npm run serve 打包项目就能正常浏览