Vue源码之rollup环境搭建步骤详解_vue.js_

--在终端输,入安装依赖 npm install rollup rollup-plugin-babel @babel/core @babel/preset-env --save-dev 

 "scripts": { // 用rollup来打包,执行rpllup.config.js，-c指定配置文件 -w监控文件变化 "dev": "rollup -cw" }, 

// index.js export const number = 1 

// rpllup.config.js // rollup默认可以导出一个对象，作为打包的配置文件 import babel from 'rollup-plugin-babel' export default { input:'./src/index.js', // 入口 output:{ file:'./dist/vue.js', // 出口 name:'Vue', // global.Vue format:'umd', //打包格式: esm es6模块 commnjs模块 iife自执行函数 umd统一模块规范 umd兼容(commnjs模块 iife自执行函数) sourcemap:true, // 希望可以调试源代码 }, plugins:[ //babel一般会建立一个单独的配置文件.babelrc babel({ exclude:'node_modules/**' // 排除mode_modules所有文件，不需要打包这些文件 }) ] } 

//.babelrc // preset 预设也就是插件集合 { "presets": [ "@babel/preset-env" ] } 

//vue.js (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : typeof define === 'function' && define.amd ? define(['exports'], factory) : (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Vue = {})); })(this, (function (exports) { 'use strict'; var number = 1; exports.number = number; Object.defineProperty(exports, '__esModule', { value: true }); })); //# sourceMappingURL=vue.js.map