Merge pull request #7061 from ahocevar/issue-pr-templates
Update docs and issue and pull request instructions
This commit is contained in:
@@ -0,0 +1,7 @@
|
|||||||
|
This issue tracker is for reporting bugs or feature requests, not for asking questions. For usage questions, refer to the (documentation)[http://openlayers.org/en/latest/doc/].
|
||||||
|
|
||||||
|
Ready to submit your bug or feature request? Make sure these boxes are checked before submitting your issue. Thank you!
|
||||||
|
|
||||||
|
- [ ] I have searched GitHub to see if a similar bug or feature request has already been reported.
|
||||||
|
- [ ] If reporting a bug, I have tried with the latest version of OpenLayers (see 'LATEST' on https://openlayers.org/)
|
||||||
|
- [ ] If reporting a bug, I have created a [CodePen](https://codepen.io) or prepared a stack trace (using the latest version and unminified code, so e.g. `ol-debug.js`, not `ol.js`) that shows the issue.
|
||||||
@@ -0,0 +1,5 @@
|
|||||||
|
Make sure these boxes are checked before submitting your pull request. Thank you!
|
||||||
|
|
||||||
|
- [ ] This pull request addresses an issue that has been marked with the 'Pull request accepted' label.
|
||||||
|
- [ ] It contains one or more small, incremental, logically separate commits, with no merge commits.
|
||||||
|
- [ ] I have used clear commit messages.
|
||||||
@@ -9,9 +9,13 @@
|
|||||||
|
|
||||||
## Getting Started
|
## Getting Started
|
||||||
|
|
||||||
|
Use one of the following methods to use OpenLayers in your project:
|
||||||
|
|
||||||
|
- For use with mainstream bundlers and minifiers, install the [ol](https://www.npmjs.com/package/ol) npm package: `npm install ol`
|
||||||
|
- Use `ol.js` and `ol.css` from (cdnjs)[https://cdnjs.com/libraries/openlayers]
|
||||||
- Download the [latest release](https://openlayers.org/download/)
|
- Download the [latest release](https://openlayers.org/download/)
|
||||||
- Install with npm: `npm install openlayers`
|
|
||||||
- Clone the repo: `git clone git@github.com:openlayers/openlayers.git`
|
- Clone the repo: `git clone git@github.com:openlayers/openlayers.git`
|
||||||
|
- For use with Closure Library, install the [openlayers](https://npmjs.com/package/openlayers) npm package and read the [tutorial](http://openlayers.org/en/latest/doc/tutorials/closure.html).
|
||||||
|
|
||||||
## Supported Browsers
|
## Supported Browsers
|
||||||
|
|
||||||
@@ -33,4 +37,3 @@ Please see our guide on [contributing](CONTRIBUTING.md) if you're interested in
|
|||||||
|
|
||||||
- Need help? Find it on [Stack Overflow using the tag 'openlayers'](http://stackoverflow.com/questions/tagged/openlayers)
|
- Need help? Find it on [Stack Overflow using the tag 'openlayers'](http://stackoverflow.com/questions/tagged/openlayers)
|
||||||
- Follow [@openlayers](https://twitter.com/openlayers) on Twitter
|
- Follow [@openlayers](https://twitter.com/openlayers) on Twitter
|
||||||
- Discuss with openlayers users on IRC in `#openlayers` at `chat.freenode`
|
|
||||||
|
|||||||
+2
-2
@@ -11,7 +11,7 @@ For a more in-depth overview of OpenLayers core concepts, check out the [tutoria
|
|||||||
|
|
||||||
Make sure to also check out the [OpenLayers workshop](/workshop/).
|
Make sure to also check out the [OpenLayers workshop](/workshop/).
|
||||||
|
|
||||||
Find additional reference material in the [API docs](../apidoc).
|
Find additional reference material in the [API docs](../apidoc) and [examples](../examples).
|
||||||
|
|
||||||
# Frequently Asked Questions (FAQ)
|
# Frequently Asked Questions (FAQ)
|
||||||
|
|
||||||
@@ -19,4 +19,4 @@ We have put together a document that lists [Frequently Asked Questions (FAQ)](fa
|
|||||||
|
|
||||||
# More questions?
|
# More questions?
|
||||||
|
|
||||||
If you cannot find an answer in the documentation or the FAQ, you can ask your question on [Stack Overflow using the tag 'openlayers'](http://stackoverflow.com/questions/tagged/openlayers).
|
If you cannot find an answer in the documentation or the FAQ, you can search [Stack Overflow](http://stackoverflow.com/questions/tagged/openlayers). If you cannot find an answer there, ask a new question there, using the tag 'openlayers'.
|
||||||
|
|||||||
+30
-32
@@ -5,57 +5,56 @@ layout: doc.hbs
|
|||||||
|
|
||||||
# Introduction
|
# Introduction
|
||||||
|
|
||||||
When going beyond modifying existing examples you might be looking for a
|
When going beyond modifying existing examples you might be looking for a way to setup your own code with dependency management together with external dependencies like OpenLayers.
|
||||||
way to setup your own code with dependency management together with external
|
|
||||||
dependencies like OpenLayers.
|
|
||||||
|
|
||||||
This tutorial serves as a suggested project setup using NPM and Browserify
|
This tutorial serves as a suggested project setup using NPM and Browserify for the most basic needs. There are several other options, and in particular you might be interested in a more modern one (ES2015) [using Webpack with OpenLayers](https://gist.github.com/tschaub/79025aef325cd2837364400a105405b8).
|
||||||
for the most basic needs. There are several other options and in particular
|
|
||||||
you might be interested in
|
|
||||||
[compiling your own code together with OpenLayers](closure.html).
|
|
||||||
|
|
||||||
## Initial steps
|
## Initial steps
|
||||||
|
|
||||||
Create a new empty directory for your project and navigate to it by running
|
Create a new empty directory for your project and navigate to it by running `mkdir new-project && cd new-project`. Initialize your project using `npm init` and answer the questions asked.
|
||||||
`mkdir new-project && cd new-project`. Initialize your project using `npm init`
|
|
||||||
and answer the questions asked.
|
|
||||||
|
|
||||||
At this point you can ask NPM to add required dependencies by running
|
Add OpenLayers as dependency to your application with `npm install --save ol`.
|
||||||
`npm install --save-dev openlayers browserify watchify uglify-js`. Watchify and
|
|
||||||
Uglify will be used to monitor for changes and to build into a minified
|
At this point you can ask NPM to add required development dependencies by running
|
||||||
bundle.
|
```
|
||||||
|
npm install --save-dev cssify browserify cssify http-server uglify-js watchify
|
||||||
|
npm install --save-dev babelify babel-plugin-transform-es2015-modules-commonjs
|
||||||
|
```
|
||||||
|
We will be using `cssify` to include the css definitions required by OpenLayers in our bundle. `watchify`, `http-server` and `uglify-js` are used to monitor for changes and to build into a minified bundle. `babelify` and `babel-plugin-transform-es2015-modules-commonjs` are used to make the `ol` package, which was created using ES2015 modules, work with CommonJS.
|
||||||
|
|
||||||
## Application code and index.html
|
## Application code and index.html
|
||||||
|
|
||||||
Place your application code in `index.js`. Here is a simple starting point:
|
Place your application code in `index.js`. Here is a simple starting point:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var ol = require('openlayers');
|
require('ol/ol.css');
|
||||||
|
var ol_Map = require('ol/map').default;
|
||||||
|
var ol_layer_Tile = require('ol/layer/tile').default;
|
||||||
|
var ol_source_OSM = require('ol/source/osm').default;
|
||||||
|
var ol_View = require('ol/view').default;
|
||||||
|
|
||||||
var map = new ol.Map({
|
var map = new ol_Map({
|
||||||
target: 'map',
|
target: 'map',
|
||||||
layers: [
|
layers: [
|
||||||
new ol.layer.Tile({
|
new ol_layer_Tile({
|
||||||
source: new ol.source.OSM()
|
source: new ol_source_OSM()
|
||||||
})
|
})
|
||||||
],
|
],
|
||||||
view: new ol.View({
|
view: new ol_View({
|
||||||
center: [0, 0],
|
center: [0, 0],
|
||||||
zoom: 0
|
zoom: 0
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
```
|
```
|
||||||
|
|
||||||
You will also need an `ìndex.html` file that will use your bundle. Here is a simple
|
You will also need an `ìndex.html` file that will use your bundle. Here is a simple example:
|
||||||
example:
|
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<!doctype html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>Using Browserify with OpenLayers</title>
|
<title>Using Browserify with OpenLayers</title>
|
||||||
<link rel="stylesheet" href="node_modules/openlayers/dist/ol.css" type="text/css">
|
|
||||||
<style>
|
<style>
|
||||||
#map {
|
#map {
|
||||||
width: 400px;
|
width: 400px;
|
||||||
@@ -72,18 +71,17 @@ example:
|
|||||||
|
|
||||||
## Creating a bundle
|
## Creating a bundle
|
||||||
|
|
||||||
With simple scripts you can introduce the commands `npm run build` and `npm start` to
|
With simple scripts you can introduce the commands `npm run build` and `npm start` to manually build your bundle and watch for changes, respectively. Add the following to the script section in `package.json`:
|
||||||
manually build your bundle and watch for changes, respectively. Add the following
|
|
||||||
to the script section in `package.json`:
|
|
||||||
|
|
||||||
```json
|
```json
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "watchify index.js --outfile bundle.js",
|
"start": "watchify index.js -g cssify --outfile bundle.js & http-server",
|
||||||
"build": "browserify index.js | uglifyjs --compress --output bundle.js"
|
"build": "browserify -g cssify index.js | uglifyjs --compress --output bundle.js"
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
Now to test your application open http://localhost:8080/ in your browser. `watchify` will update `bundle.js` whenever you change something. You simply need to reload the page in your browser to see the changes.
|
||||||
|
```
|
||||||
|
$ npm start
|
||||||
|
```
|
||||||
|
|
||||||
Note that `bundle.js` will contain your application code and all dependencies
|
Note that `bundle.js` will contain your application code and all dependencies used in your application. From OpenLayers, it only contains the required components.
|
||||||
used in your application, in this case the official full build of OpenLayers.
|
|
||||||
If you only need parts of OpenLayers you can create
|
|
||||||
[custom builds](../../builder).
|
|
||||||
|
|||||||
@@ -5,11 +5,15 @@ layout: doc.hbs
|
|||||||
|
|
||||||
# Compiling Application with Closure Compiler
|
# Compiling Application with Closure Compiler
|
||||||
|
|
||||||
|
**Note**: When building an application with dependencies that are available as [npm](https://npmjs.com/) packages, it will probably be easier to use the [ol](https://npmjs.com/package/ol) package and follow the instructions there.
|
||||||
|
|
||||||
The OpenLayers code uses the Closure Library, and it is compiled with the
|
The OpenLayers code uses the Closure Library, and it is compiled with the
|
||||||
Closure Compiler. Using OpenLayers in an application does not require using
|
Closure Compiler. Using OpenLayers in an application does not require using
|
||||||
Closure. But using Closure in an OpenLayers application is possible. And this
|
Closure. But using Closure in an OpenLayers application is possible. And this
|
||||||
is what this tutorial is about.
|
is what this tutorial is about.
|
||||||
|
|
||||||
|
When you want to include OpenLayers as separate script without bundling with your application, follow the [Creating custom builds](./custom-builds.html) tutorial instead.
|
||||||
|
|
||||||
This tutorial will teach you how to set up an OpenLayers application based on
|
This tutorial will teach you how to set up an OpenLayers application based on
|
||||||
the [`closure-util`](https://github.com/openlayers/closure-util) node package,
|
the [`closure-util`](https://github.com/openlayers/closure-util) node package,
|
||||||
which provides utilities for working with Closure. Using `closure-util` is one
|
which provides utilities for working with Closure. Using `closure-util` is one
|
||||||
|
|||||||
Reference in New Issue
Block a user