Skip to content

Commit e40b369

Browse files
committed
adapt README and BUILDING for 'sub' npm pacakges
... and refactor "Quick start options" section. List CDN first, plotly.js-dist 2nd and github release 3rd
1 parent a1238e7 commit e40b369

File tree

2 files changed

+21
-22
lines changed

2 files changed

+21
-22
lines changed

BUILDING.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# Building plotly.js
22

3+
The easiest way to bundle plotly.js into your application is to use the one of the distributed plotly.js packages on npm. These distributed packages should just work with **any** build framework. That said, if you're looking to save a few bytes, read the section below corresponding to your building framework.
4+
35
## Webpack
46

57
For plotly.js to build with Webpack you will need to install [[email protected]+](https://github.com/hughsk/ify-loader) and add it to your `webpack.config.json`. This adds Browserify transform compatibility to Webpack which is necessary for some plotly.js dependencies.

README.md

Lines changed: 19 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -32,48 +32,45 @@ and more.
3232

3333
## Quick start options
3434

35-
#### Download the latest release
36-
[Latest Release on Github](https://github.com/plotly/plotly.js/releases/)
35+
#### Use the plotly.js CDN hosted by Fastly
3736

38-
and use the plotly.js `dist` file(s). More info [here](https://github.com/plotly/plotly.js/blob/master/dist/README.md).
37+
```html
38+
<!-- Latest compiled and minified plotly.js JavaScript -->
39+
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
3940

40-
#### Clone the repo
41+
<!-- OR use a specific plotly.js release (e.g. version 1.5.0) -->
42+
<script src="https://cdn.plot.ly/plotly-1.5.0.min.js"></script>
4143

42-
```bash
43-
git clone https://github.com/plotly/plotly.js.git
44+
<!-- OR an un-minified version is also available -->
45+
<script src="https://cdn.plot.ly/plotly-latest.js" charset="utf-8"></script>
4446
```
4547

46-
and use the plotly.js `dist` file(s).
48+
and use the `Plotly` object in the window scope.
4749

4850
#### Install with `npm`
4951

5052
```bash
51-
npm install plotly.js
53+
npm install plotly.js-dist
5254
```
5355

54-
and require plotly.js using CommonJS as `var Plotly = require('plotly.js');` or use the plotly.js `dist` file(s).
56+
and import plotly.js as `import Plotly from 'plotly.js-dist';` or `var Plotly = require('plotly.js-dist');`.
5557

56-
#### Use the plotly.js CDN hosted by Fastly
57-
```html
58-
<!-- Latest compiled and minified plotly.js JavaScript -->
59-
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
60-
61-
<!-- OR use a specific plotly.js release (e.g. version 1.5.0) -->
62-
<script src="https://cdn.plot.ly/plotly-1.5.0.min.js"></script>
58+
#### Download the latest release
6359

64-
<!-- OR an un-minified version is also available -->
65-
<script src="https://cdn.plot.ly/plotly-latest.js"></script>
66-
```
60+
[Latest Release on Github](https://github.com/plotly/plotly.js/releases/)
6761

68-
and use the `Plotly` object in the window scope.
62+
and use the plotly.js `dist` file(s). More info [here](https://github.com/plotly/plotly.js/blob/master/dist/README.md).
6963

7064
##### Read the [Getting started page](https://plot.ly/javascript/getting-started/) for more examples.
7165

66+
7267
## Modules
7368

74-
Starting in `v1.15.0`, plotly.js also ships with several _partial_ bundles (more info [here](https://github.com/plotly/plotly.js/blob/master/dist/README.md#partial-bundles)).
69+
Starting in `v1.15.0`, plotly.js ships with several _partial_ bundles (more info [here](https://github.com/plotly/plotly.js/blob/master/dist/README.md#partial-bundles)).
70+
71+
Starting in `v1.39.0`, plotly.js publishes _distributed_ npm packages with no dependencies. For example, run `npm install plotly.js-geo-dist` and add `import Plotly from 'plotly.js-geo-dist';` to your code to start using the plotly.js geo package.
7572

76-
If you would like to manually pick which plotly.js modules to include, you can create a *custom* bundle by using `plotly.js/lib/core`, and loading only the trace types that you need (e.g. `pie` or `choropleth`). The recommended way to do this is by creating a *bundling file*:
73+
If you would like to manually pick which plotly.js modules to include, you'll first need to run `npm install plotly.js` and then create a *custom* bundle by using `plotly.js/lib/core`, and loading only the trace types that you need (e.g. `pie` or `choropleth`). The recommended way to do this is by creating a *bundling file*. For example, in CommonJS:
7774

7875
```javascript
7976
// in custom-plotly.js

0 commit comments

Comments
 (0)