Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Build with rollup #220

Merged
merged 3 commits into from
Oct 3, 2017
Merged

Build with rollup #220

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
2e5490d
Build with rollup
lencioni Oct 2, 2017
bf06b2b
Use index.js and index.mjs for built artifacts
lencioni Oct 2, 2017
f4296e7
Update rollup config for rollup 0.48
lencioni Oct 3, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 1 addition & 5 deletions .babelrc
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
{
"plugins": [
"transform-react-jsx",
"add-module-exports"
],
"presets": ["es2015"]
"presets": [["airbnb", { "modules": false }]]
}
11 changes: 6 additions & 5 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@
"name": "react-waypoint",
"version": "7.2.0",
"description": "A React component to execute a function whenever you scroll to an element.",
"main": "build/waypoint.js",
"main": "build/index.js",
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if both of these are just "build" - which is the best practice - does that mean rollup can't figure out the destination filenames?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't understand your question. What is a best practice? What is rollup not figuring out?

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"main": "build", "module": "build".

I don't see anywhere else index.js or index.mjs are specified tho, which leads me to believe that rollup infers the filenames from the package.json fields.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, it doesn't infer anything. It is configured with an explicit dependency on these fields in the rollup config. https://github.com/brigade/react-waypoint/pull/220/files#diff-ff6e5f22a9c7e66987b19c0199636480

+    targets: [
+      { dest: pkg.main, format: 'cjs' },
+      { dest: pkg.module, format: 'es' }
+    ],

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That specifies the format, but not the file extension. Where would spaghetti and meatballs go?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It specifies the path currently. If we change it to spaghetti and meatballs, it would go in the package.json.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right - that confirms my initial hunch, which is that putting just "build" wouldn't work, because it would deprive rollup of the actual path.

"module": "build/index.mjs",
"types": "index.d.ts",
"repository": {
"type": "git",
Expand All @@ -11,7 +12,7 @@
"homepage": "https://github.com/brigade/react-waypoint",
"bugs": "https://github.com/brigade/react-waypoint/issues",
"scripts": {
"build": "npm run clean && babel src/ -d build/",
"build": "npm run clean && rollup -c",
"check-changelog": "expr $(git status --porcelain 2>/dev/null| grep \"^\\s*M.*CHANGELOG.md\" | wc -l) >/dev/null || (echo 'Please edit CHANGELOG.md' && exit 1)",
"check-only-changelog-changed": "(expr $(git status --porcelain 2>/dev/null| grep -v \"CHANGELOG.md\" | wc -l) >/dev/null && echo 'Only CHANGELOG.md may have uncommitted changes' && exit 1) || exit 0",
"clean": "rimraf build",
Expand All @@ -36,9 +37,7 @@
"babel-cli": "^6.23.0",
"babel-core": "^6.23.1",
"babel-loader": "^6.4.0",
"babel-plugin-add-module-exports": "^0.2.1",
"babel-plugin-transform-react-jsx": "^6.23.0",
"babel-preset-es2015": "^6.22.0",
"babel-preset-airbnb": "^2.4.0",
"eslint": "^3.17.1",
"eslint-config-brigade": "^3.2.1",
"eslint-plugin-react": "^6.10.0",
Expand All @@ -53,6 +52,8 @@
"react": "^16.0.0",
"react-dom": "^16.0.0",
"rimraf": "^2.6.1",
"rollup": "^0.50.0",
"rollup-plugin-babel": "^3.0.2",
"safe-publish-latest": "^1.1.1",
"webpack": "^2.3.3"
},
Expand Down
21 changes: 21 additions & 0 deletions rollup.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import babel from 'rollup-plugin-babel';
import pkg from './package.json';

export default [
{
input: 'src/waypoint.jsx',
external: [
...Object.keys(pkg.dependencies),
...Object.keys(pkg.peerDependencies),
],
output: [
{ file: pkg.main, format: 'cjs' },
{ file: pkg.module, format: 'es' }
],
plugins: [
babel({
exclude: ['node_modules/**']
})
]
}
];