rollup 打包按需引入

import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import babel from '@rollup/plugin-babel';
import { terser } from 'rollup-plugin-terser'; // 一款基于 UglifyJS 的 JavaScript 压缩工具
import vue from 'rollup-plugin-vue';
import postcss from 'rollup-plugin-postcss';

const plugins = [
  vue({
    css: true, // 将 CSS 提取为单独的文件进行输出
    template: { isProduction: true } // 设置模板选项,以便在生产环境中移除注释和空格
  }),
  postcss({
    // PostCSS 插件配置,用于处理 CSS
    modules: true
  }),
  resolve(),
  commonjs(),
  babel(),
  terser()
]

export default {
  input: 'src/components/index.js', // 入口文件
  output: {
    dir: 'dist', // 输出目录
    format: 'esm', // 输出格式
    entryFileNames: '[name].mjs', // 入口文件名
    exports: 'named', // 导出类型
    preserveModules: true, // 保留模块结构
    globals: {
      vue: 'Vue' // 将 Vue 模块设置为全局变量 Vue
    },
  },
  plugins,
  external: ['vue', 'style-inject', 'node_moules'],
};

 

posted @ 2023-06-30 11:20  王小美丶  阅读(162)  评论(0编辑  收藏  举报