Node.js/npm
をテンプレートにして作成
LECTURE
担当科目一覧
コンピュータ概論/2024
データサイエンス/2024
3DCG演習/2024
情報デザイン研究/2024
卒業研究/2024
KEYWORDS
WEB DESIGN
SOCIAL DESIGN
SQUARES
LINKS
九州産業大学
芸術学部
芸術研究科
九産大美術館
九産大図書館
年間スケジュール
動画ニュース他
交通情報
気象・環境情報
危機に備えて
K'sLife
Office365Mail
Tools
SEARCH
開始行:
*Node.js|npm
Node Package Manager
~
**概要
***これは何?
npm(Node Package Manager) とは、Node.js の モジュールの...
Node.js では、その機能の拡張する様々なプログラムがパッケ...
~
***配布パッケージの利用方法
GitHub等で配布されている Node のサンプルパッケージは、一...
-ダウンロードしたパッケージをデスクトップ等で解凍・展開し...
-[[Terminal]]で当該ディレクトリに移動して下さい。
--例えば、''user01'' ユーザーがデスクトップに置いた ''sam...
$ cd /Users/user01/Desktop/sample
--ls コマンドで、package.json が見える状態であればOKです。
$ ls
・・・・ package.json ・・・・
-必要なパッケージをインストールします。
$ npm install
これで、依存するファイルが当該ディレクトリにダウンロード...
-以下のコマンドで Webアプリが起動します。
$ npm start
package.json ファイルの ''start:'' 部分に書かれたスクリプ...
-一般には、Terminalに以下のようなコンソール・ログが表示さ...
Server running on port:8000
-ブラウザから以下のようにアクセスすると、Webアプリケーシ...
http://localhost:8000
-アプリケーションを終了する場合は、Terminal で、以下の操...
[CTRL]+[C]
~
~
**npmを利用したWebアプリの開発手順
***前提
-[[Terminal]]でログインして操作することが前提です。
-プロジェクト専用のディレクトリ(フォルダ)をつくって、そ...
~
***プロジェクト専用ディレクトリの準備
-サンプルプロジェクト用のディレクトリ(フォルダ)をつくり...
-Terminal を開いて、cd コマンドで当該ディレクトリに移動し...
注)Terminal アイコンがある場合は、当該フォルダをそこに重...
~
***プロジェクトの初期化 > package.json の生成
-プロジェクトの初期化作業を行います。以下のコマンドはプロ...
$ npm init
-以下のようなメッセージが出て、初期情報の入力が促されます。
This utility will walk you through creating a package.js...
It only covers the most common items, and tries to guess...
See `npm help json` for definitive documentation on thes...
and exactly what they do.
Use `npm install <pkg>` afterwards to install a package ...
save it as a dependency in the package.json file.
Press ^C at any time to quit.
中断したいときは、[CTRL] + C です。
-最初の項目であるタイトルのみ(例えば sample)、その他は...
$ ls ← ls はディレクトリの中身を表示するコマンド
package.json
-以下、package.jsonの内容です。
$ cat package.json ← cat はファイルの内容を表示するコマ...
{
"name": "sample",
"version": "1.0.0",
"description": "test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "koichi",
"license": "ISC",
}
-''package.json'' はパッケージのバージョン情報を保持した ...
~
***パッケージの追加
-パッケージの追加には2つの方法があります。
--Node.js の環境本体に追加する(グローバル・インストール)
$npm install -g [ PackageName ]
--プロジェクトディレクトリに追加する(ローカル・インスト...
$npm install [ PackageName ]
-ここでは、テンプレートエンジン [[EJS>Google: Node.js EJS...
$ npm install ejs
-Terminal には、インストール中メッセージが出ます。終了す...
. / :プロジェクトルート
|- packege.json
|- node_modules
|- ejs
-フォルダを開けるか、あるいは Terminal の lsコマンドで確...
$ ls -al
drwxr-xr-x 5 user_name 160 10 18 11:38 .
drwx------+ 59 user_name 1888 10 18 10:58 ..
drwxr-xr-x 3 user_name 96 10 18 11:38 node_modules
-rw-r--r-- 1 user_name 344 10 18 11:38 package-lock....
-rw-r--r-- 1 user_name 257 10 18 11:38 package.json
-package.json にはインストール情報が蓄積される仕組みにな...
"dependencies": {
"ejs": "^2.7.1"
}
-cat コマンドで確認してみます
$ cat package.json
{
"name": "sample",
"version": "1.0.0",
"description": "test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "koichi",
"license": "ISC",
"dependencies": {
"ejs": "^2.7.1"
}
}
-付記:package-lock.json とは
package.jsonの変更に際して自動作成・変更されるファイルで...
--package.json は購入(予定)リスト
--package-lock.json は購入済みリスト
以上、Node.js によるアプリ開発では、ここに自身で開発した...
~
***パッケージの配布・ダウンロード
プロジェクトディレクトリそのものが、アプリケーションの全...
$ npm install
これで、package.json に書かれた情報に従って、必要なものが...
以下、サンプルの配布事例です。ダウンロードしてお試しくだ...
https://github.com/koichi-inoue/NodeJS_WebServer
~
~
**npmコマンド
***パッケージの初期化
プロジェクトルート に package.json が作成されます。
$ npm init
~
***パッケージのインストール
-グローバルモード(Node.jsの環境自体にインストール)
以下のように ''-g オプション''をつけてコマンドを実行しま...
$ npm install –g typings
-ローカルモード(プロジェクトごとにインストール)
プロジェクトルートで以下のようにコマンドを実行します。パ...
$ npm install jquery
$ npm install jquery@1.1.0 (バージョンを指定する例)
~
***パッケージのアップデート
-未更新の確認
$ npm outdated
-更新
$ npm update
~
***パッケージのアンインストール
-以下、グローバルとローカルの例
$ npm uninstall -g typings
$ npm uninstall jquery
~
***パッケージの復元
プロジェクトルートにパッケージ情報が記載された package.js...
$ npm install
~
***パッケージの起動
パッケージアプリケーションを起動します。
$ npm start
プロンプトが使えなくなった場合、通常は [CTRL]+[C]で停止で...
~
~
~
終了行:
*Node.js|npm
Node Package Manager
~
**概要
***これは何?
npm(Node Package Manager) とは、Node.js の モジュールの...
Node.js では、その機能の拡張する様々なプログラムがパッケ...
~
***配布パッケージの利用方法
GitHub等で配布されている Node のサンプルパッケージは、一...
-ダウンロードしたパッケージをデスクトップ等で解凍・展開し...
-[[Terminal]]で当該ディレクトリに移動して下さい。
--例えば、''user01'' ユーザーがデスクトップに置いた ''sam...
$ cd /Users/user01/Desktop/sample
--ls コマンドで、package.json が見える状態であればOKです。
$ ls
・・・・ package.json ・・・・
-必要なパッケージをインストールします。
$ npm install
これで、依存するファイルが当該ディレクトリにダウンロード...
-以下のコマンドで Webアプリが起動します。
$ npm start
package.json ファイルの ''start:'' 部分に書かれたスクリプ...
-一般には、Terminalに以下のようなコンソール・ログが表示さ...
Server running on port:8000
-ブラウザから以下のようにアクセスすると、Webアプリケーシ...
http://localhost:8000
-アプリケーションを終了する場合は、Terminal で、以下の操...
[CTRL]+[C]
~
~
**npmを利用したWebアプリの開発手順
***前提
-[[Terminal]]でログインして操作することが前提です。
-プロジェクト専用のディレクトリ(フォルダ)をつくって、そ...
~
***プロジェクト専用ディレクトリの準備
-サンプルプロジェクト用のディレクトリ(フォルダ)をつくり...
-Terminal を開いて、cd コマンドで当該ディレクトリに移動し...
注)Terminal アイコンがある場合は、当該フォルダをそこに重...
~
***プロジェクトの初期化 > package.json の生成
-プロジェクトの初期化作業を行います。以下のコマンドはプロ...
$ npm init
-以下のようなメッセージが出て、初期情報の入力が促されます。
This utility will walk you through creating a package.js...
It only covers the most common items, and tries to guess...
See `npm help json` for definitive documentation on thes...
and exactly what they do.
Use `npm install <pkg>` afterwards to install a package ...
save it as a dependency in the package.json file.
Press ^C at any time to quit.
中断したいときは、[CTRL] + C です。
-最初の項目であるタイトルのみ(例えば sample)、その他は...
$ ls ← ls はディレクトリの中身を表示するコマンド
package.json
-以下、package.jsonの内容です。
$ cat package.json ← cat はファイルの内容を表示するコマ...
{
"name": "sample",
"version": "1.0.0",
"description": "test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "koichi",
"license": "ISC",
}
-''package.json'' はパッケージのバージョン情報を保持した ...
~
***パッケージの追加
-パッケージの追加には2つの方法があります。
--Node.js の環境本体に追加する(グローバル・インストール)
$npm install -g [ PackageName ]
--プロジェクトディレクトリに追加する(ローカル・インスト...
$npm install [ PackageName ]
-ここでは、テンプレートエンジン [[EJS>Google: Node.js EJS...
$ npm install ejs
-Terminal には、インストール中メッセージが出ます。終了す...
. / :プロジェクトルート
|- packege.json
|- node_modules
|- ejs
-フォルダを開けるか、あるいは Terminal の lsコマンドで確...
$ ls -al
drwxr-xr-x 5 user_name 160 10 18 11:38 .
drwx------+ 59 user_name 1888 10 18 10:58 ..
drwxr-xr-x 3 user_name 96 10 18 11:38 node_modules
-rw-r--r-- 1 user_name 344 10 18 11:38 package-lock....
-rw-r--r-- 1 user_name 257 10 18 11:38 package.json
-package.json にはインストール情報が蓄積される仕組みにな...
"dependencies": {
"ejs": "^2.7.1"
}
-cat コマンドで確認してみます
$ cat package.json
{
"name": "sample",
"version": "1.0.0",
"description": "test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "koichi",
"license": "ISC",
"dependencies": {
"ejs": "^2.7.1"
}
}
-付記:package-lock.json とは
package.jsonの変更に際して自動作成・変更されるファイルで...
--package.json は購入(予定)リスト
--package-lock.json は購入済みリスト
以上、Node.js によるアプリ開発では、ここに自身で開発した...
~
***パッケージの配布・ダウンロード
プロジェクトディレクトリそのものが、アプリケーションの全...
$ npm install
これで、package.json に書かれた情報に従って、必要なものが...
以下、サンプルの配布事例です。ダウンロードしてお試しくだ...
https://github.com/koichi-inoue/NodeJS_WebServer
~
~
**npmコマンド
***パッケージの初期化
プロジェクトルート に package.json が作成されます。
$ npm init
~
***パッケージのインストール
-グローバルモード(Node.jsの環境自体にインストール)
以下のように ''-g オプション''をつけてコマンドを実行しま...
$ npm install –g typings
-ローカルモード(プロジェクトごとにインストール)
プロジェクトルートで以下のようにコマンドを実行します。パ...
$ npm install jquery
$ npm install jquery@1.1.0 (バージョンを指定する例)
~
***パッケージのアップデート
-未更新の確認
$ npm outdated
-更新
$ npm update
~
***パッケージのアンインストール
-以下、グローバルとローカルの例
$ npm uninstall -g typings
$ npm uninstall jquery
~
***パッケージの復元
プロジェクトルートにパッケージ情報が記載された package.js...
$ npm install
~
***パッケージの起動
パッケージアプリケーションを起動します。
$ npm start
プロンプトが使えなくなった場合、通常は [CTRL]+[C]で停止で...
~
~
~
ページ名: