Vite打包静态文件拷贝需求

  默认打包静态文件如图:

  需求为将index.html文件打包到自定义文件夹。如./Index中。由于vite没有webpack的indexPath方法,所以查阅资料决定使用rollupJS插件。

  Vite用Rollup为构建工具。Rollup是基于ES2015的JavaScript打包工具。相比其他JavaScript打包工具,Rollup总能打出更小,更快的包。

  安装插件:npm install rollup-plugin-copy -dev

  在vite.congig.js配置如下

import vue from '@vitejs/plugin-vue'
import copy from 'rollup-plugin-copy' //引入插件
const path = require('path')

export default{
    plugins: [vue(),copy({
        targets: [
          { src: './public/index.html', dest: './Index' }, //执行拷贝
        ]
      })],
    base: './',
    resolve:{
        alias:{
            '@': path.resolve(__dirname, './src')
        }
    },
    // 生产环境移除console
    build:{
        terserOptions:{
            compress:{
                drop_console:true
            }
        },
        outDir:'public',   //指定输出路径
        assetsDir: "wap", //指定生成静态资源的存放路径
    },
}

 

posted @ 2021-05-13 15:40  sanvae  阅读(12486)  评论(0)    收藏  举报