8000 Angular cli readme instructions by TomDemulierChevret · Pull Request #2260 · plotly/plotly.js · GitHub
[go: up one dir, main page]
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 1 commit
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
Next Next commit
Add instruction to build with Angular CLI
  • Loading branch information
@TomDemulierChevret
TomDemulierChevret committed Jan 18, 2018
commit 07b3e6a1b254575aea94b3243cb5098e42dc1c51
35 changes: 35 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,41 @@ 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-plotly.js-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
...
"compilerOptions": {
...
"paths": {
"plotly.js": [
// List here the modules you want to import
// this exemple is enough for scatter plots
"../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
0