// rollup.config.js 配置importresolvefrom"@rollup/plugin-node-resolve";importcommonjsfrom'@rollup/plugin-commonjs';importjsonfrom'@rollup/plugin-json';exportdefault{input:'./src/main.js',// 入口output:{file:'./dist/bundle.js',// 出口format:'es',},plugins:[commonjs({include:/node_module...
import { cloneDeep } from 'lodash' const obj1 = {}; const obj2 = cloneDeep(obj1) 这些包长啥样? 我们打开node_modules中的lodash发现,里面其实都是打包后的产物,也就是开发 lodash 的开发者,编写一些例如ts、ES6语法的代码后,进行打包后发布到npm上,我们才可以通过npm i lodash去安装它~ 那为啥要打包...
写法跟.gitignore一样的,比如上面就是在发布的时候忽略node_modules文件夹,.babelrc、rollup.config.js和tsconfig.json文件。你能够看到images文件夹不在其中,所以发布的时候把images也发布上去了。现在在.npmignore里加上images/,然后修改package.json里的版本号为"version": "1.0.1"。因为我们待会要发布更新后的库,...
我们打开 node_modules 中的 lodash 发现,里面其实都是打包后的产物,也就是开发 lodash 的开发者,编写一些例如 ts、ES6 语法的代码后,进行 打包后 发布到 npm 上,我们才可以通过 npm i lodash 去安装它~ 图片 那为啥要 打包后 才发布到 npm 上呢?这是因为 需要把 ts、ES6 这些比较新语法转换成 ES5 的旧...
/node_modules # compiled output /dist 详细的配置可以参考Github官方文档:https://docs.github.com/en/free-pro-team@latest/github/using-git/ignoring-files 1.2 创建开源协议声明 LICENSE 开源协议可以在创建Github仓库时选择,也可以创建仓库之后再加,一般选择MIT协议。
{input:'./src/index.js',output:{file:'./lib/bundle.js',format:'es',},plugins:[resolve(),babel({exclude:'node_modules/**',// 只编译我们的源代码presets:['@babel/preset-env','@babel/preset-react'],}),commonjs(),],// 设置react为外部引用,可避免打包时打进去,否则警告(!) Unresolved...
babel({exclude:'node_modules/**',// 防止打包node_modules下的文件runtimeHelpers:true,// 使plugin-transform-runtime生效}), 4. external属性 使用rollup打包,我们在自己的库中需要使用第三方库,例如lodash等,又不想在最终生成的打包文件中出现jquery。这个时候我们就需要使用external属性。比如我们使用了lodash,...
rollup-plugin-node-resolve — rollup 无法识别node_modules中的包,帮助 rollup 查找外部模块,然后导入 rollup-plugin-commonjs —将 CommonJS 模块转换为 ES6 供 rollup 处理 rollup-plugin-babel — ES6 转 ES5,让我们可以使用 ES6 新特性来编写代码
在pnpm的monorepo组件库中,使用了rollup作为打包器,因引用了第三方commonjs的包,需要使用@rollup/plugin-node-resolve和@rollup/plugin-commonjs组合,转换node_modules里的一个第三方commonjs包,转成es模块 目前是这么配置的 output: { dir: 'dist', preserveModules: true, ...