Skip to content

Commit a1f8f80

Browse files
authored
Merge pull request #3 from jaebradley/setup-semantic-release
Setup semantic release
2 parents fac7392 + ed83517 commit a1f8f80

File tree

6 files changed

+3942
-979
lines changed

6 files changed

+3942
-979
lines changed

.travis.yml

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
language: node_js
2+
cache:
3+
directories:
4+
- ~/.npm
5+
notifications:
6+
email: true
7+
node_js:
8+
- '8'
9+
before_install:
10+
- npm install -g npm@5
11+
- npm install -g greenkeeper-lockfile@1
12+
before_script: greenkeeper-lockfile-update
13+
after_script: greenkeeper-lockfile-upload
14+
script:
15+
- npm run lint
16+
- npm run test
17+
- npm run build
18+
after_success:
19+
- npm run travis-deploy-once "npm run semantic-release"
20+
- npm run codecov
21+
- if [ "$TRAVIS_BRANCH" = "master" -a "$TRAVIS_PULL_REQUEST" = "false" ]; then npm run deploy-storybook-ci; fi
22+
branches:
23+
except:
24+
- /^v\d+\.\d+\.\d+$/

README.md

Lines changed: 49 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,49 @@
1-
# example-react-component-npm-package
2-
Example React Component, Published to npm
1+
# example-rollup-react-component-npm-package
2+
3+
Example `React` component "library" using [`rollup`](https://github.com/rollup/rollup) that is published to `npm`.
4+
5+
## `rollup` and `webpack`
6+
7+
There are a lot of articles that compare `rollup` and `webpack` (like [this](https://medium.com/webpack/webpack-and-rollup-the-same-but-different-a41ad427058c) or [this](https://webpack.js.org/comparison/) or [this](https://stackoverflow.com/a/43255948/5225575) or [this](https://nolanlawson.com/2016/08/15/the-cost-of-small-modules/)).
8+
9+
The general point is
10+
> `webpack` is generally a better fit for applications, and `rollup` is generally a better fit for libraries
11+
<sup>[1](#general-footnote)</sup>
12+
13+
## So what is this project?
14+
15+
I've never used `rollup` before - hell, I've *barely* used `webpack` before.
16+
17+
This was mostly to see how easy / difficult it was to create a `React` component package using `rollup` (aka "proof-of-concept").
18+
19+
My requirements for this package were
20+
21+
1. Use `babel`
22+
2. Use `semantic-release`
23+
3. Use `sass`
24+
4. Support `umd` and `es` modules
25+
5. Use `storybook`
26+
6. Make the exported components really simple
27+
28+
## My general thoughts
29+
30+
* Seemed pretty easy to get started with `rollup`
31+
* There are **a lot of plugins** <sup>[2](#metric-fuck-ton-footnote)</sup>
32+
* Pretty easy to specify output types (`umd` and `es`, for example)
33+
* Some `rollup` plugins didn't really play nicely with `babel@7` - which is why I downgraded to `6` (I could definitely be messing something up)
34+
* Not an easy way to plug `storybook` in
35+
* It's weird and feels kind've gross because `storybook` is using `webpack` to build 😬
36+
* Articles that were helpful
37+
* [`rollup` Guide](https://rollupjs.org/guide/en)
38+
* [How I Set Up a React Component Library with Rollup](https://medium.com/tech-grandata-com/how-i-set-up-a-react-component-library-with-rollup-be6ccb700333)
39+
* [Publishing Baller React Modules](https://hackernoon.com/publishing-baller-react-modules-2b039d84bce7) <sup>[3](#baller-react-modules-footnote)</sup>
40+
* [Making of a Component Library for React](https://hackernoon.com/making-of-a-component-library-for-react-e6421ea4e6c7)
41+
* The [`transitive-bullshit/create-react-library`](https://github.com/transitive-bullshit/create-react-library) was also very useful to inspect
42+
43+
## Footnotes
44+
45+
<ul>
46+
<li><a name="general-footnote"><sup>1</sup></a>general general general general general. In general, I could do this all day.</li>
47+
<li><a name="metric-fuck-ton-footnote"><sup>2</sup></a><a href="https://github.com/rollup/rollup/wiki/Plugins">Like a metric fuck ton of plugins</a></li>
48+
<li><a name="baller-react-modules-footnote"><sup>3</sup></a><a href="https://media.giphy.com/media/oOTTyHRHj0HYY/giphy.gif">How I feel about "baller"</a></li>
49+
</ul>

commitlint.config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = { extends: ['@commitlint/config-angular'] };

0 commit comments

Comments
 (0)