rollup打包项目：rollup.config.js

本文主要是介绍rollup打包项目：rollup.config.js，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

rollup打包带vue文件的项目

import nodeResolve from '@rollup/plugin-node-resolve'
import babel from '@rollup/plugin-babel'
import commonjs from '@rollup/plugin-commonjs';
import vuePlugin from 'rollup-plugin-vue';
import typescript from 'rollup-plugin-typescript2';
import scss from 'rollup-plugin-scss'
import postcss from 'rollup-plugin-postcss';  
import postScss from 'postcss-scss';
import autoprefixer from 'autoprefixer';  
import cssnano from 'cssnano';  
import replace from '@rollup/plugin-replace';
let defaults = { compilerOptions: { declaration: true } };
let override = { compilerOptions: { declaration: false } };export default {input: { // 这种写法也可以进行多入口打包login: 'main.js',},output: {dir: 'dist',format: 'es'},plugins: [babel({exclude: 'node_modules/**',}),nodeResolve(), // 解析 node_modules 中的模块  commonjs(), // 将 CommonJS 模块转换为 ES6 模块 vuePlugin({compileTemplate: true,css: true,}),typescript({tsconfigDefaults: defaults,tsconfig: "tsconfig.json",tsconfigOverride: override}),replace({values: {'process.env.NODE_ENV': '"production"'}}),scss(),postcss({  plugins: [  autoprefixer(),  cssnano(), // 用于压缩 CSS  ], parser: postScss, // 使用 postcss-scss 解析 SCSS 文件   extract: 'assets/index.css', // 指定输出的 CSS 文件名，包括路径  outputStyle: 'compressed' // 压缩 CSS，使其最小化  }), ]
};

rollup打包原生html,js,css项目

import nodeResolve from "@rollup/plugin-node-resolve";
import babel from "@rollup/plugin-babel";
import commonjs from "@rollup/plugin-commonjs";
import terser from "@rollup/plugin-terser";
import copy from "rollup-plugin-copy";
import postcss from "rollup-plugin-postcss";
import scss from "postcss-scss";
import autoprefixer from "autoprefixer";
import cssnano from "cssnano";export default {// input: 'static/source/js/mainHome.js', // 输入文件的路径input: {// 这种写法也可以进行多入口打包login: "src/js/mainLogin.js",home: "src/js/mainHome.js"},output: {dir: "dist",format: "es",},plugins: [babel({exclude: "node_modules/**",}),nodeResolve(), // 解析 node_modules 中的模块commonjs(), // 将 CommonJS 模块转换为 ES6 模块copy({targets: [{ src: "src/views", dest: "dist/views" },{ src: "static/source/img/**/*", dest: "dist/img" },],}),postcss({plugins: [autoprefixer(), cssnano()], // 在这里添加你需要的PostCSS插件，例如autoprefixer等parser: scss, // 使用 postcss-scss 解析 SCSS 文件// extract: true, // 将 CSS 提取到单独的文件中extract: "css/index.css",outputStyle: "compressed", // 压缩 CSS，使其最小化}),terser(), // 使用 Terser 进行代码压缩],
};

这篇关于rollup打包项目：rollup.config.js的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---