Merge pull request #7061 from ahocevar/issue-pr-templates

Update docs and issue and pull request instructions
This commit is contained in:
Andreas Hocevar
2017-07-28 17:02:33 +02:00
committed by GitHub
6 changed files with 54 additions and 37 deletions
+7
View File
@@ -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.
+5
View File
@@ -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.
+5 -2
View File
@@ -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
View File
@@ -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'.
+31 -33
View File
@@ -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 map = new ol.Map({ 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({
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).
+4
View File
@@ -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