Skip to content

Latest commit

 

History

History
94 lines (73 loc) · 1.75 KB

1、快速开始.md

File metadata and controls

94 lines (73 loc) · 1.75 KB

初始化 package.json

npm init -y

增加 -y 参数不用一直按 Enter,全部采用默认设置

准备目录

├── build # 编译脚本
│   └── rollup.config.js
├── dist # 编译结果
│   └── index.js
├── example # HTML引用例子
│   └── index.html
├── package.json
└── src # ES6源码
    └── index.js

安装依赖

## 安装 rollup.js 基础模块
npm i --save-dev rollup

rollup 配置

  1. 配置文件路径 ../build/rollup.config.js
const path = require("path");

const resolve = function (filePath) {
  return path.join(__dirname, "..", filePath);
};

module.exports = {
  input: resolve("src/index.js"),
  output: {
    file: resolve("dist/index.js"),
    format: "iife",
  },
};
  1. package.json 配置编译命令
{
  "scripts": {
    "build": "rollup -c ./build/rollup.config.js"
  }
}

编译源码

  1. 源码路径 ../src/index.js
  2. 源码内容
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];

const result = [...arr1, ...arr2];
console.log(result);

编译结果

  1. 在项目根目录下执行npm run build
  2. 编译结果在../dist/目录下
  3. 示例源码
<!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>
    <script src="https://cdn.bootcdn.net/ajax/libs/babel-polyfill/7.12.1/polyfill.js"></script>
    <script src="../dist/index.js"></script>
  </head>
  <body></body>
</html>
  1. 访问http://localhost:3001/