一、环境配置
1、初始化npm
2、安装组件
使用rollup搭建js库，核心是@babel/core，@babel/preset-env将高级语法编译为低级语法，rollup-plugin-babel将rollup和babel关联起来。
3、添加rollup配置文件
rollup.config.js
import babel from 'rollup-plugin-babel'
export default{
input: './src/index.js', // 打包的入口
output:{
file: 'dist/vue.js', // 打包的出口
format: 'umd', // 常见的格式 IIFE ESM CJS UMD
name: 'Vue', // UMD格式需要配置name，会将导出的模块放到window上，如果在node上使用cjs，如果只是打包webpack里面导入esm模块，前端里 script iife umd
sourcemap: true, // 源码映射
},
plugins:[
babel({
exclude: 'node_modules/**', // 忽略node_module下的内容
})
]
}
4、创建入口文件
src/index.js
function Vue(option){
}
export default Vue;
5、使用打包后的文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app"></div>
<script src="./vue.js"></script>
<script>
const vm = new Vue()
</script>
</body>
</html>
