Skip to content

Angular cli readme instructions #2260

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

Closed
wants to merge 2 commits into from
Closed

Angular cli readme instructions #2260

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
07b3e6a
Add instruction to build with Angular CLI
TomDemulierChevret Jan 18, 2018
af04866
Fix inter section link & json example
TomDemulierChevret Jan 18, 2018
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
32 changes: 32 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,38 @@ A repo that demonstrates how to build plotly.js with Webpack can be found [here]
...
```

#### Building plotly.js with Angular CLI

Currently Angular CLI use Webpack under the hood to bundle and build your Angular application.
Sadly it doesn't allow to override its Webpack config, and therefore to use the plugin mentioned in [Building plotly.js with Webpack](#building-plotlyjs-with-webpack).
Without this plugin your build will fail when it tries to build glslify for GLSL plots.

Currently 2 solutions exists to circumvent this issue :
1) If you need to use GLSL plots, you can create a Webpack config from your Angular CLI projet with [ng eject](https://github.com/angular/angular-cli/wiki/eject).
This will allow you to follow the instructions regarding Webpack.
2) If you don't need to use GLSL plots, you can make a custom build containing only the required modules for your plots.
The clean way to do it with Angular CLI is not the method described in [Modules](#modules) but the following :
```typescript
// in the Component you want to create a graph
import * as Plotly from 'plotly.js';
```

```json
// in src/tsconfig.app.json
// List here the modules you want to import
// this exemple is for scatter plots
{
"compilerOptions": {
"paths": {
"plotly.js": [
"../node_modules/plotly.js/lib/core.js",
"../node_modules/plotly.js/lib/scatter.js"
]
}
}
}
```

## Bugs and feature requests

Have a bug or a feature request? Please first read the [issues guidelines](https://github.com/plotly/plotly.js/blob/master/CONTRIBUTING.md#opening-issues).
Expand Down