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 进行代码压缩
],
};