私は初心者なので、URLへのリンクを含めるか、用語を説明して理解できるようにしてください。
ターミナルを介してMac OS(10.13.3)に「npm」をインストールし、それを使用してSASSなどのパッケージをインストールしました。
Npmを使用して sass-mq をインストールしようとしています。私はそれをインストールできたと思いますが、それが不完全であったか、または実行中に間違っていたことについて、セカンドオピニオンをお願いします。
最初は、sass-mq Githubページの指示に従って、使用しようとしました:
npm install sass-mq --save
これは私にこのエラーを与えました:
npm WARN saveError ENOENT: no such file or directory, open '/Users/<username>/package.json'
npm WARN enoent ENOENT: no such file or directory, open '/Users/<username>/package.json'
npm WARN <username> No description
npm WARN <username> No repository field.
npm WARN <username> No README data
npm WARN <username> No license field.
+ [email protected]
updated 1 package and audited 1 package in 1.67s
found 0 vulnerabilities
見てみると、私は使用するつもりだと気づいた
npm init
..「install sass-mq --save」コマンドを入力する前に。
かっこいい。次のエラーはこれでした:
package name: (nikhil) sass-mq
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
About to write to /Users/nikhil/package.json:
{
"name": "sass-mq",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"sass-mq": "^5.0.0"
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
Is this OK? (yes)
darwin:~ nikhil$ npm install sass-mq --save
npm ERR! code ENOSELF
npm ERR! Refusing to install package with name "sass-mq" under a package
**npm ERR! also called "sass-mq". Did you name your project the same
npm ERR! as the dependency you're installing?**
これは、 'sass-mq'(ローカルパッケージの名前としてパッケージの名前です)を使用できないと言っていると思います(?)ローカルマシンにインストールします。 一部詳細はこちら
だから私はこれを試しました:
**package name: (sass-mq) media-queries-nikhil**
version: (1.0.0)
description:
git repository:
keywords:
author:
license: (ISC)
About to write to /Users/nikhil/package.json:
うまくいったようです。
私の質問は次のとおりです。これは正しい方法ですか。通常、これをどのように行いますか?
また、これらの警告が表示されます-それらを無視しても大丈夫ですか?
npm WARN [email protected] No description
npm WARN [email protected] No repository field.
私はこの質問を部分的に作成しているので、同様の問題に対する答えを探している私のような人が、問題を修正するために必要なコマンドだけでなく、説明を見つけることができます。似たような質問スレッドをいくつか見つけましたが、実際に何が起こったのか、なぜ起こったのかを説明したものはありませんでした。
読んでくれてありがとう、これで助けてくれて本当に感謝しています:)
TL; DR:あなたがそれを行った方法は問題ありません。あなたはそれらの警告について心配する必要はありません。
Npmが存在する理由とその仕組みの詳細については、先に進んでください。
npmはNode Package Managerを表します。パッケージはノードエコシステムの基本的な部分です。一般的な問題に対する他の人のソリューションを使用できるようにするために存在します。
ただし、これは非常に混乱する可能性があります。これは、これがオープンソースコミュニティであるため、それらはすべて異なる人々によって異なる時期にリリースされるためです。また、使用する2つの異なるパッケージは、実際には完全に未知の3番目のパッケージに依存している可能性があります潜在的には、そのパッケージの異なるバージョンが必要になる場合があります。
すでにお分かりのように、これは非常に厄介になる可能性があります。
npmは、これらの「依存関係」を管理および考えるのがより簡単な方法で対処するのに役立ちますが、npmを使用することは必須ではありません。これらすべての異なるファイルを自分で整理するノードアプリを作成できます。しかし、これは非常に迅速に非常に混乱するため、少なくとも99%のケースで実際の利点はありません。他にもパッケージマネージャーがあります-個人的にはyarnを使用していますが、すべて同じようなことをしようとしているため、その選択は主に好みの問題であり、この説明の範囲外です。
したがって、新しいプロジェクトを開始するときに_npm init
_と入力すると、npmがpackage.jsonというフォルダーにファイルを作成し、これらの依存関係を整理できるようになります。 package.jsonは、独自のアプリ(独自のパッケージ)に関する情報と、npmに独自のプロジェクトで依存関係として使用する予定のパッケージを保持します。これが、パッケージ名と説明に関するすべての質問を尋ねる理由です。パッケージを公開した場合、連絡先、実行内容、バージョンなどを知ることができます。
パッケージを実際に公開する場合にのみ、この深刻な考えを与えることが重要です。これは、Webサイトの場合はそうではありませんが、ライブラリを作成する場合は非常に可能です。ただし、既に発見したように、パッケージには一意の名前が付けられているため、パッケージを個人的な名前にする必要があるため、名前を付けようとしたときに名前の競合が発生することはありません後でインストールしようとしたパッケージと同じパッケージ。
それでは、独自のパッケージを作成し、最初の依存関係をインストールしてみましょう(これは単なる別のパッケージです)。タイムスタンプは小さくて小さいため、依存関係としてタイムスタンプを選択します。
まず、プロジェクトディレクトリを作成します。これは単なる空の新しいディレクトリです。 ts
と呼びましょう。 tsディレクトリ内から、ターミナルに_npm init
_と入力し、その質問に答えます(ただし、通常はすべてに戻るボタンを押すだけです)。その後、ディレクトリ内を見ると、package.jsonファイルが表示されます。ファイルを開くと、すべてのyourパッケージ情報が表示されます。そして、現在はそれだけです。
コマンドラインに戻り、_npm install time-stamp
_と入力します。考え終わったら、package.jsonをもう一度開くと、「依存関係」のリストで参照されているタイムスタンプが表示されます。 (npm 5以降、_--save
_オプションを使用する必要はなくなりました。npmはこれをデフォルトと見なします。 npm installの--saveオプションとは? )
ディレクトリ内に戻ると、package-lock.jsonという別のファイルとnode_modulesというディレクトリも表示されます。
Node_modulesディレクトリには、タイムスタンプと呼ばれるディレクトリが含まれ、タイムスタンプを機能させるすべてのコードが保持されます。おそらくここを頻繁に調べる必要はありませんが、可能です。タイムスタンプディレクトリ内を見ると、独自のpackage.jsonがあることがわかります。開いて見てみると、インストールに必要なすべての情報があります。依存関係はありませんが、依存関係がある場合は、node_modulesにtheir依存関係がすべてインストールされますwell ...およびtheir依存関係...およびtheirs ...これを実際に見たい場合は、テストフレームワーク 'jestをインストールしてみてください。繰り返しますが、ちょうど_npm install jest
_です。
うまくいけば、今は全体が少し意味を成し始めています...
ロックファイルは少し複雑です。それは、プロジェクトを新しいシステムにデプロイするときに、まったく同じ依存関係のセットを使用することを確認することです。 npmが物事を整理する方法は最新のリリースバージョンなどに依存する可能性があるため、これを行う必要があります。アプリを展開しようとしても、依存関係が異なる状態で動作しているために機能しなかった場合は非常に迷惑になります開発環境からの道!
これをすべて言ったが、基本的にはこの段階でそれを無視できる!これはnpmの重要な部分ですが、何をしているのか本当にわかっていない限り、直接編集しないでください。
依存関係をインストールしたら、プロジェクトでrequire
またはimport
itanywhere、ディレクトリ構造内の正しいパスにリダイレクトすることを心配する必要はありません。ただrequire('time-stamp')
だけで問題なく動作します!
最後に、これまでのところうまくいきました。グローバルインストールについて言及する価値があります。 _-g
_オプション(つまり_npm install time-stamp -g
_)を使用すると、プロジェクトのnode_modulesフォルダーではなく、コンピューターのどこかにある中央のnode_modulesディレクトリーに依存関係がインストールされます。ただし、それをプロジェクトにリンクする必要があるため(package.jsonで依存関係として終了する)、_npm link time-stamp
_と入力してリンクを作成します。個人的には、すべてのモジュールがプロジェクトのローカルにあるのが好きですが、これもユースケースとある程度個人的な好みに依存します。
これがすべて意味するのは、package.jsonとロックファイルの組み合わせがnode_modules内のすべてのファイルの完全な表現であるということです。つまり、する必要はありませんそれらをgit(または他のリポジトリ)に入れてください。リポジトリを新しいサーバーにプルダウンすることができ、あなたがしなければならないことは_npm install
_と入力するだけです。そこからインターネットから。これは、依存関係に関係するすべてのファイルのために、大規模なプロジェクトがある場合に非常に重要になりますが、「node_modules」を最初から.gitignoreに追加するのが良い習慣です。しかし、私はトピックを降り始めているので、ここで終了する必要があります...
これは基本的な紹介を目的とするだけなので、かなり単純にしておき、詳細なチュートリアルを作成したくはありませんが、作成したポイントのいずれかを明確にする必要がある場合は、お気軽にコメントして、できれば編集します!
プロジェクトに、インストールしようとしているパッケージ名と同じ名前を付けることはできません。
パッケージjsonでプロジェクトの名前を変更して再試行するか、npm initを再試行して別の名前を使用します。
実行時に同じ問題が発生しました:
npm install -g @ vue/cli
多くの研究と実験の後、代わりに働いた唯一のものは:
npm install -g @ vue/cli @ latest
プロジェクトを閉じて再度開くと、問題が修正されます