将vue打包成静态文件

将 Vue.js 应用打包成静态文件，可以方便地将应用部署到服务器上。下面是将 Vue.js 应用打包成静态文件的基本步骤：

1. 安装 Vue CLI

Vue CLI 是一个基于 Vue.js 的标准化工具，可以帮助开发者快速搭建 Vue.js 应用。安装 Vue CLI 的命令如下：

npm install -g vue-cli

2. 创建项目

使用 Vue CLI 创建一个新的 Vue.js 项目，命令如下：

vue init webpack my-project

其中，my-project 是项目名称。

3. 进入项目目录并安装依赖

cd my-project
npm install

4. 构建项目

使用以下命令将 Vue.js 应用打包成静态文件：

npm run build

执行完命令后，会在项目根目录下生成一个 dist 目录，其中包含了打包后的静态文件。可以将这些文件复制到服务器上，然后通过浏览器访问即可。

需要注意的是，如果 Vue.js 应用中使用了路由功能，打包时需要在 webpack.prod.conf.js 文件中进行配置，例如：

// webpack.prod.conf.js
const config = {
  // ...
  build: {
    // ...
    // 打包后的静态文件所在的目录
    assetsPublicPath: '/',
    // 是否开启 source map
    productionSourceMap: true,
    // 开启 Gzip 压缩
    productionGzip: true,
    productionGzipExtensions: ['js', 'css'],
    // 配置路由
    html: {
      title: 'My App',
      // 配置路由
      chunks: ['manifest', 'vendor', 'app']
    }
  }
}

以上就是将 Vue.js 应用打包成静态文件的基本步骤。