Skip to content

Commit

Permalink
Replace NPM with npm everywhere
Browse files Browse the repository at this point in the history
  • Loading branch information
martijnwalraven committed Mar 26, 2016
1 parent 1ceb880 commit 616ff67
Show file tree
Hide file tree
Showing 17 changed files with 84 additions and 84 deletions.
26 changes: 13 additions & 13 deletions content/1.3-migration.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ These are all the *breaking changes* -- that is changes that you absolutely have

- Files within your app named `*.test[s].*`, `*.app-test[s].*`, `*.spec[s].*` and `*.app-spec[s].*` will no longer load eagerly (you should probably rename such a file if it doesn't contain tests, as it will be eagerly loaded by our new [app testing modes](#testing)).

- If you are using React you will now need to install a set of React NPM packages in your app. See the [recommendations for React](#react) below for more details.
- If you are using React you will now need to install a set of React npm packages in your app. See the [recommendations for React](#react) below for more details.

<h3 id="breaking-changes-mobile">Mobile</h3>

Expand All @@ -32,7 +32,7 @@ These are all the *breaking changes* -- that is changes that you absolutely have

<h2 id="modules">Recommended change: use modules</h2>

The biggest new feature in Meteor 1.3 is support for [ES2015 modules](https://developer.mozilla.org/en/docs/web/javascript/reference/statements/import) on the client and the server. Using modules you can declare dependencies between files, control load order, and use NPM packages on the client and server easily.
The biggest new feature in Meteor 1.3 is support for [ES2015 modules](https://developer.mozilla.org/en/docs/web/javascript/reference/statements/import) on the client and the server. Using modules you can declare dependencies between files, control load order, and use npm packages on the client and server easily.

- You should load all Meteor "psuedo-globals" using the `import { Name } from 'meteor/package' syntax. For instance:

Expand All @@ -43,21 +43,21 @@ import { EJSON } from 'meteor/ejson';

- If you are using app-local packages to control load order and write unit tests for your application, we recommend you switch to using modules. You can read about our recommended structure for applications and modules in the [Application Structure article](structure.html) of the Meteor Guide, and how to test them in the [Testing article](testing.html).

- If you are using Atmosphere packages which simply wrap NPM packages, both on the client and server, it is now recommended that you simply install them using NPM. Run `npm init` to initialize your `package.json` and install packages with `npm install --save` (or `npm install --save-dev` if it's development dependency for testing etc.). We have [some tips](using-packages.html#async-callbacks) about how to use NPM packages written in an asyncronous style.
- If you are using Atmosphere packages which simply wrap npm packages, both on the client and server, it is now recommended that you simply install them using npm. Run `npm init` to initialize your `package.json` and install packages with `npm install --save` (or `npm install --save-dev` if it's development dependency for testing etc.). We have [some tips](using-packages.html#async-callbacks) about how to use npm packages written in an asyncronous style.

Also, you should no longer need to use the [`meteorhacks:npm`](https://atmospherejs.com/meteorhacks/npm) package.

<h2 id="packages">Recommended changes: package authors</h2>

Package authors are recommended to:

- No longer publish wrapper packages that do no more than include an NPM package / client side lib. If your package adds significant wrappers around the NPM package, it might make sense however.
- No longer publish wrapper packages that do no more than include an npm package / client side lib. If your package adds significant wrappers around the npm package, it might make sense however.

- Publish to NPM when appropriate, especially if your package can be used by the wider JS community!
- Publish to npm when appropriate, especially if your package can be used by the wider JS community!

- Use [`api.mainModule()`](http://1.3-docs.meteorapp.com/#/full/modularpackagestructure) and `export` from your main module rather than `api.exports()` in Atmosphere packages.

- If you depend (directly or transitively) on a client side NPM package that is large or problematic if installed twice (e.g. React), use [`tmeasday:check-npm-versions`](https://github.com/tmeasday/check-npm-versions) to declare "peer" dependencies. Read more about this in the [Writing Packages article](writing-packages.html#peer-npm-dependencies).
- If you depend (directly or transitively) on a client side npm package that is large or problematic if installed twice (e.g. React), use [`tmeasday:check-npm-versions`](https://github.com/tmeasday/check-npm-versions) to declare "peer" dependencies. Read more about this in the [Writing Packages article](writing-packages.html#peer-npm-dependencies).

<h2 id="testing">Recommended changes: Testing</h2>

Expand Down Expand Up @@ -89,16 +89,16 @@ Along side some of the breaking mobile changes [listed above](#breaking-mobile),

- The plugin now allows for local file access on both iOS and Android. You can construct file system URLs manually (`http://localhost:<port>/local-filesystem/<path>`) or use `WebAppLocalServer.localFileSystemUrl()` to convert a `file://` URL.

<h2 id="react">Install React from NPM</h2>
<h2 id="react">Install React from npm</h2>

In Meteor 1.3, we recommend installing `react` and `react-dom` [into your app using NPM](react.html#using-with-meteor), and importing them from your app code:
In Meteor 1.3, we recommend installing `react` and `react-dom` [into your app using npm](react.html#using-with-meteor), and importing them from your app code:

```js
import React from 'react';
import ReactDOM from 'react-dom';
```

As mentioned in the [breaking changes](#breaking-changes), the `react` Atmosphere package still works, but it now expects you to install the React NPM packages it uses in your application (read the [Using Packages](using-packages.html) article for more details about how to manage your NPM dependencies):
As mentioned in the [breaking changes](#breaking-changes), the `react` Atmosphere package still works, but it now expects you to install the React npm packages it uses in your application (read the [Using Packages](using-packages.html) article for more details about how to manage your npm dependencies):

```
npm install --save react react-dom react-addons-transition-group \
Expand All @@ -107,7 +107,7 @@ npm install --save react react-dom react-addons-transition-group \
react-addons-test-utils react-addons-perf
```

**However**, we recommend that you should stop using the `react` or `react-runtime` Atmosphere packages and instead install React directly from NPM (for more detail, see the [React article](react.html) of the guide). To make this change in an existing app, you can run:
**However**, we recommend that you should stop using the `react` or `react-runtime` Atmosphere packages and instead install React directly from npm (for more detail, see the [React article](react.html) of the guide). To make this change in an existing app, you can run:

```
meteor remove react
Expand All @@ -124,7 +124,7 @@ Then, in your application, you should import React directly rather than [relying
import React from 'react';
```

If you are using a package that depends on the `react` or `react-runtime` Atmosphere packages, you will still need to install the full list of NPM React packages above, so we encourage package authors to update their packages to import React directly from NPM.
If you are using a package that depends on the `react` or `react-runtime` Atmosphere packages, you will still need to install the full list of npm React packages above, so we encourage package authors to update their packages to import React directly from npm.

<h3 id="react-meteor-data">Loading data with React</h3>

Expand All @@ -144,10 +144,10 @@ As part of the 1.3 release, we have some new guide articles and updated sections

- There's a [Mobile](mobile.html) article which covers how to best use our Cordova integration. [Still to come]

- There's a [Using Packages](using-packages.html) article which explains how best to use both NPM and Atmosphere packages in your app.
- There's a [Using Packages](using-packages.html) article which explains how best to use both npm and Atmosphere packages in your app.

- There's a [Writing Packages](writing-packages.html) article which explains practice for writing Atmosphere packages and using all kinds of dependencies within them.

- The UI/UX article has been updated to explain how to do [i18n](ui-ux.html#i18n) in Meteor applications.

- The Build tool article has been updated to explain how [NPM support](build-tool.html#npm) works in Meteor 1.3.
- The Build tool article has been updated to explain how [npm support](build-tool.html#npm) works in Meteor 1.3.
2 changes: 1 addition & 1 deletion content/accounts.md
Original file line number Diff line number Diff line change
Expand Up @@ -399,7 +399,7 @@ For more details about the data stored in the user database, read the section be
Now that you have the access token, you need to actually make a request to the appropriate API. Here you have two options:

1. Use the [`http` package](http://docs.meteor.com/#/full/http) to access the service's API directly. You'll probably need to pass the access token from above in a header. For details you'll need to search the API documentation for the service.
2. Use a package from Atmosphere or NPM that wraps the API into a nice JavaScript interface. For example, if you're trying to load data from Facebook you could use the [fbgraph](https://www.npmjs.com/package/fbgraph) NPM package. Read more about how to use NPM with your app in the [Build System article](build-tool.html#npm).
2. Use a package from Atmosphere or npm that wraps the API into a nice JavaScript interface. For example, if you're trying to load data from Facebook you could use the [fbgraph](https://www.npmjs.com/package/fbgraph) npm package. Read more about how to use npm with your app in the [Build System article](build-tool.html#npm).

<h2 id="displaying-user-data">Loading and displaying user data</h2>

Expand Down
4 changes: 2 additions & 2 deletions content/build-tool.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: Build system
order: 12
description: How to use Meteor's build system to compile your app, and use packages from Atmosphere and NPM.
description: How to use Meteor's build system to compile your app, and use packages from Atmosphere and npm.
discourseTopicId: 19669
---

Expand Down Expand Up @@ -151,7 +151,7 @@ meteor add juliancwirko:postcss
meteor add standard-minifiers-js
```
Then we can install any NPM CSS processing packages that we'd like to use and reference them from a `postcss` section of our `package.json`. In the Todos example app, we use `autoprefixer` package to increase browser support:
Then we can install any npm CSS processing packages that we'd like to use and reference them from a `postcss` section of our `package.json`. In the Todos example app, we use `autoprefixer` package to increase browser support:

```
{
Expand Down
4 changes: 2 additions & 2 deletions content/code-style.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,13 +83,13 @@ Below, you can find directions for setting up automatic linting at many differen

<h3 id="eslint-installing">Installing and running ESLint</h3>

To setup ESLint in your application, you can install the following NPM packages:
To setup ESLint in your application, you can install the following npm packages:

```
npm install --save-dev eslint eslint-plugin-react eslint-plugin-meteor eslint-config-airbnb
```

You can also add a `eslintConfig` section to your `package.json` to specify that you'd like to use the AirBnB config, and to enable [ESLint-plugin-Meteor](https://github.com/dferber90/eslint-plugin-meteor). You can also setup any extra rules you want to change, as well as adding a lint NPM command:
You can also add a `eslintConfig` section to your `package.json` to specify that you'd like to use the AirBnB config, and to enable [ESLint-plugin-Meteor](https://github.com/dferber90/eslint-plugin-meteor). You can also setup any extra rules you want to change, as well as adding a lint npm command:

```
{
Expand Down
6 changes: 3 additions & 3 deletions content/mobile.md
Original file line number Diff line number Diff line change
Expand Up @@ -278,13 +278,13 @@ By default, the startup timeout is set to 20 seconds. If your app needs more tim

Cordova comes with a plugin architecture that opens up access to features not usually available to web apps. Plugins are installable add-ons that contain both JavaScript and native code, which allows them to translate calls from your web app to platform-specific APIs.

The Apache Cordova project maintains a set of [core plugins](https://cordova.apache.org/docs/en/dev/guide/support/index.html#core-plugin-apis) that provide access to various native device features such as the camera, contacts, or access to the file system. But anyone can write a Cordova plugin to do basically anything that can be done from native code, and many third-party plugins are available. You can [search for plugins on the Cordova website](https://cordova.apache.org/plugins/) or directly on [NPM](https://www.npmjs.com/search?q=ecosystem%3Acordova).
The Apache Cordova project maintains a set of [core plugins](https://cordova.apache.org/docs/en/dev/guide/support/index.html#core-plugin-apis) that provide access to various native device features such as the camera, contacts, or access to the file system. But anyone can write a Cordova plugin to do basically anything that can be done from native code, and many third-party plugins are available. You can [search for plugins on the Cordova website](https://cordova.apache.org/plugins/) or directly on [npm](https://www.npmjs.com/search?q=ecosystem%3Acordova).

Be warned however, that although the core plugins are generally well maintained and up to date with the rest of Cordova, the quality of third-party plugins can be a bit of a gamble. You also have to make sure the plugin you want to use is [compatible with the Cordova platform versions Meteor bundles](#plugin-compatibility).

<h3 id="installing-plugins">Installing plugins</h3>

Plugins are identified by a name, which is generally the same as their NPM package name. The current convention is for plugin names to start with `cordova-plugin-`, but not all third-party plugins adhere to this.
Plugins are identified by a name, which is generally the same as their npm package name. The current convention is for plugin names to start with `cordova-plugin-`, but not all third-party plugins adhere to this.

You can add Cordova plugins to your project either directly, or as a dependency of a Meteor package.

Expand All @@ -310,7 +310,7 @@ This means adding the Meteor package to your project would also install the spec
Because installing plugins into a Cordova project already containing plugins can lead to indeterminate results, Meteor will remove and add back all plugins whenever a change to any of the plugins in your project is made.

Cordova downloads plugins from NPM, and caches them (in `~/.cordova/lib/npm_cache`) so they don't have to be downloaded repeatedly if you rebuild or use them again in another project.
Cordova downloads plugins from npm, and caches them (in `~/.cordova/lib/npm_cache`) so they don't have to be downloaded repeatedly if you rebuild or use them again in another project.

> <h4 id="plugin-compatibility">Making sure a plugin is compatible with the bundled Cordova platform versions</h4>
Expand Down
12 changes: 6 additions & 6 deletions content/react.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ To get started with React in Meteor, you can follow along the [React tutorial](h

<h3 id="using-with-meteor">Installing and using React</h3>

To install React in Meteor 1.3 you should simply add it as an NPM dependency:
To install React in Meteor 1.3 you should simply add it as an npm dependency:

```sh
npm install --save react react-dom
Expand Down Expand Up @@ -66,15 +66,15 @@ meteor add static-html

<h3 id="using-third-party-npm-packages">Using 3rd party packages</h3>

If you'd like to use a third party React component that has been published on NPM (such as the ones you find on the [React Components site](http://react-components.com)), you can simple `npm install --save` them and `import` from within your app.
If you'd like to use a third party React component that has been published on npm (such as the ones you find on the [React Components site](http://react-components.com)), you can simple `npm install --save` them and `import` from within your app.

For example, to use the excellent [Griddle](http://griddlegriddle.github.io/Griddle/) React package, you could run

```sh
npm install --save griddle-react
```

Then, like with any other [NPM package](using-packages.html#npm), you can import the component in your application:
Then, like with any other [npm package](using-packages.html#npm), you can import the component in your application:

```js
import React from 'react';
Expand Down Expand Up @@ -302,10 +302,10 @@ These include some notable differences like:

<h3 id="atmosphere-packages">Using React in Atmosphere Packages</h3>

If you are writing an Atmosphere package and want to depend on React or an NPM package that itself depends on React, you can't use `Npm.depends()` and `Npm.require()`, as this will result in *2* copies of React being installed into the application (and besides `Npm.require()` only works on the server).
If you are writing an Atmosphere package and want to depend on React or an npm package that itself depends on React, you can't use `Npm.depends()` and `Npm.require()`, as this will result in *2* copies of React being installed into the application (and besides `Npm.require()` only works on the server).

Instead, you need to ask your users to install the correct NPM packages in the application itself. This will ensure that only one copy of React is shipped to the client and there are no version conflicts.
Instead, you need to ask your users to install the correct npm packages in the application itself. This will ensure that only one copy of React is shipped to the client and there are no version conflicts.

In order to check that a user has installed the correct versions of NPM packages, you can use the [`tmeasday:check-npm-versions`](https://atmospherejs.com/tmeasday/check-npm-versions) package to check dependency versions at runtime.
In order to check that a user has installed the correct versions of npm packages, you can use the [`tmeasday:check-npm-versions`](https://atmospherejs.com/tmeasday/check-npm-versions) package to check dependency versions at runtime.

XXX: not putting in code samples here as they may change and I don't want to have to remember to do it in two places.
Loading

0 comments on commit 616ff67

Please sign in to comment.