「Npm」の版間の差分
ナビゲーションに移動
検索に移動
1行目: | 1行目: | ||
− | ==npm== | + | ==[[npm]]== |
[[Node.js]] | | [[Node.js]] | | ||
*http://qiita.com/hashrock/items/15f4a4961183cfbb2658 | *http://qiita.com/hashrock/items/15f4a4961183cfbb2658 | ||
− | ===npm init=== | + | ===[[npm]] init=== |
*プロジェクトのためのディレクトリを作成 | *プロジェクトのためのディレクトリを作成 | ||
− | *npm initを実行 | + | *[[npm]] initを実行 |
*とりあえず全部エンターキーを押しても問題ありません。 | *とりあえず全部エンターキーを押しても問題ありません。 | ||
*ディレクトリ直下にpackage.jsonが作成されます。 | *ディレクトリ直下にpackage.jsonが作成されます。 | ||
− | > npm init | + | > [[npm]] init |
This utility will walk you through creating a package.json file. | This utility will walk you through creating a package.json file. | ||
It only covers the most common items, and tries to guess sensible defaults. | It only covers the most common items, and tries to guess sensible defaults. | ||
− | See `npm help json` for definitive documentation on these fields | + | See `[[npm]] help json` for definitive documentation on these fields |
and exactly what they do. | and exactly what they do. | ||
− | Use `npm install <pkg> --save` afterwards to install a package and | + | Use `[[npm]] install <pkg> --save` afterwards to install a package and |
save it as a dependency in the package.json file. | save it as a dependency in the package.json file. | ||
43行目: | 43行目: | ||
Is this ok? | Is this ok? | ||
− | ===npm install=== | + | ===[[npm]] install=== |
− | * | + | *[[npm]]リポジトリからライブラリをダウンロードしてくる。 |
*ライブラリそのものは下記のサイト | *ライブラリそのものは下記のサイト | ||
− | **https://www. | + | **https://www.[[npm]]js.com/ |
*installは、下記の書式 | *installは、下記の書式 | ||
*node_modulesというフォルダ下に、ライブラリが保存 | *node_modulesというフォルダ下に、ライブラリが保存 | ||
− | npm install パッケージ名 | + | [[npm]] install パッケージ名 |
=====saveオプション===== | =====saveオプション===== | ||
59行目: | 59行目: | ||
!オプション | !オプション | ||
!追記先 | !追記先 | ||
− | ! | + | !外部したものを[[npm]] install 時 |
|- | |- | ||
|--save | |--save | ||
80行目: | 80行目: | ||
*ライブラリ同士の依存も自動で解決されます。 | *ライブラリ同士の依存も自動で解決されます。 | ||
− | > npm install -g browserify | + | > [[npm]] install -g browserify |
<blockquote>-g オプションはパッケージのグローバルインストールを意味します。browserify はいつでも使う便利ツールなのでシステム全体にインストールします。開発中のプロジェクト固有のパッケージをインストールするときは、-g オプションを外せば、プロジェクトフォルダの node_module フォルダ配下にダウンロードされます。</blockquote> | <blockquote>-g オプションはパッケージのグローバルインストールを意味します。browserify はいつでも使う便利ツールなのでシステム全体にインストールします。開発中のプロジェクト固有のパッケージをインストールするときは、-g オプションを外せば、プロジェクトフォルダの node_module フォルダ配下にダウンロードされます。</blockquote> | ||
90行目: | 90行目: | ||
===webpack=== | ===webpack=== | ||
*https://mae.chab.in/archives/2891 | *https://mae.chab.in/archives/2891 | ||
− | ===npm run=== | + | ===[[npm]] run=== |
− | *npm scriptsと呼ばれるタスク実行機能を呼び出す | + | *[[npm]] scriptsと呼ばれるタスク実行機能を呼び出す |
=====package.json===== | =====package.json===== | ||
{ | { | ||
98行目: | 98行目: | ||
}, | }, | ||
} | } | ||
− | =====npm run ===== | + | =====[[npm]] run ===== |
*タスクの一覧 | *タスクの一覧 | ||
− | > npm run | + | > [[npm]] run |
Lifecycle scripts included in commonjs_lesson: | Lifecycle scripts included in commonjs_lesson: | ||
test | test | ||
echo "Error: no test specified" && exit 1 | echo "Error: no test specified" && exit 1 | ||
− | =====npm run タスク===== | + | =====[[npm]] run タスク===== |
− | > npm run test | + | > [[npm]] run test |
> commonjs_lesson@1.0.0 test C:\workspaces\vscode\commonjs_lesson | > commonjs_lesson@1.0.0 test C:\workspaces\vscode\commonjs_lesson |
2020年2月16日 (日) 04:29時点における版
目次
npm
Node.js |
npm init
- プロジェクトのためのディレクトリを作成
- npm initを実行
- とりあえず全部エンターキーを押しても問題ありません。
- ディレクトリ直下にpackage.jsonが作成されます。
> npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible defaults. See `npm help json` for definitive documentation on these fields and exactly what they do. Use `npm install <pkg> --save` afterwards to install a package and save it as a dependency in the package.json file. Press ^C at any time to quit. name: (commonjs_lesson) version: (1.0.0) description: entry point: (index.js) test command: git repository: keywords: author: license: (ISC) About to write to C:\workspaces\vscode\commonjs_lesson\package.json: { "name": "commonjs_lesson", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC" } Is this ok?
npm install
- npmリポジトリからライブラリをダウンロードしてくる。
- ライブラリそのものは下記のサイト
- https://www.npmjs.com/
- installは、下記の書式
- node_modulesというフォルダ下に、ライブラリが保存
npm install パッケージ名
saveオプション
- http://qiita.com/msakamoto_sf/items/a1ae46979a42d6948ebd
- saveオプションをつけて実行すると、package.json内に、どのライブラリを取ってきたのか記述
package.json内に、どのライブラリを取ってきたのか記述
オプション | 追記先 | 外部したものをnpm install 時 |
---|---|---|
package.json の dependencies | インストールされる | |
package.json の devDependencies | インストールされない | |
package.json の optionalDependencies | インストールされる |
browserify
- node_modules下にインストールされたライブラリを、jsから参照できるようにするツール
- node_modules内のライブラリを、直接参照することができます。
- ライブラリ同士の依存も自動で解決されます。
> npm install -g browserify
<blockquote>-g オプションはパッケージのグローバルインストールを意味します。browserify はいつでも使う便利ツールなのでシステム全体にインストールします。開発中のプロジェクト固有のパッケージをインストールするときは、-g オプションを外せば、プロジェクトフォルダの node_module フォルダ配下にダウンロードされます。</blockquote>
- browserifyを使うと、下記のように書くことができる
<script src="assets/js/jquery.min.js"></script>
を
var $ = require("jquery");
webpack
npm run
- npm scriptsと呼ばれるタスク実行機能を呼び出す
package.json
{ "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, }
npm run
- タスクの一覧
> npm run Lifecycle scripts included in commonjs_lesson: test echo "Error: no test specified" && exit 1
npm run タスク
> npm run test > commonjs_lesson@1.0.0 test C:\workspaces\vscode\commonjs_lesson > echo "Error: no test specified" && exit 1 "Error: no test specified"
© 2006 矢木浩人