ホームページ >ウェブフロントエンド >Vue.js >ノード、vue、およびその他の環境構成を MAC 環境にインストールする

ノード、vue、およびその他の環境構成を MAC 環境にインストールする

演明
演明オリジナル
2021-08-24 21:28:022185ブラウズ

Web開発では一般的に環境構築が必要になりますが、前々回はバックエンド環境の構築について書きましたが、次回はフロントエンド環境の構築について紹介したいと思います。 Xiaobaiを助けることができれば幸いです。

関連する推奨事項:
1. "Windows サーバー用の Apache、php、postgresql の環境インストール " ​
2.《MAC環境へのphp、apache、MacPortsのインストール、その他の環境設定

1. ノードのインストール設定

1.ノードのインストール バージョンをダウンロードします: https://nodejs.org/en/download/ 「次へ」だけです。

インストールが完了すると、ページに次のプロンプトが表示されます:

このパッケージはインストールされています:

• Node.js v14.17.4 から /usr/local/bin/node

• npm v6.14.14 から /usr/local/bin/npm

/usr/local/bin が $PATH にあることを確認してください。

1) インストールが完了したら、コマンドを使用してノードのバージョンをテストおよび確認します。 : node - v

2) 新しいバージョンのnodeはnpmと一緒にインストールされるため、意図的にnpmをインストールする必要はありません

npmがインストールされているかどうかをテストしますnpm -v

3) インストールされているバージョンが古いバージョンの場合は、npm コマンドを使用してアップグレードできます:

$sudo npm install npm -g

4) cnpm を使用する npm を置き換えます (オプション)

理由: npm が依存関係をインストールするときに、いくつかの外国の Web サイトを使用します

cnpm はインストール時に時間を節約できます詳細はオンラインで確認できますが、必要なものはありません。高速であることだけを知ってください。

インストール構文:

$sudo npm install -g cnpm --registry=https://registry.npm.taobao.org

実行したいローカル プロジェクトがある場合は、スイッチを切り替えます。プロジェクト ディレクトリに移動して次のコマンドを実行するか、そうでない場合は [Vue インストール構成を最初に] を実行します:

(1)$sudo npm install    
(2) $sudo npm run dev  #注意每次都要运行这行命令

2. Vue インストール構成

1. nmp 経由で vue-cli スキャフォールディングをインストールします [Vue スキャフォールディング ツールは、Vue プロジェクト構造を迅速に生成するコマンド ライン ツールです]:

 $sudo npm install -g vue-cli

インストールが成功したかどうかをテストします: vue はエラーを報告しません、no

notコマンドが見つかりました 「インストールが成功したら、vue -V コマンドを使用して、インストールが成功したかどうかを確認できます。インストールが成功した場合は、現在インストールされているスキャフォールディングのバージョン番号が表示されます」という言葉が表示されるまでお待ちください]

2. vue プロジェクトを作成するには、webpack を使用する必要があります

$sudo vue init  webpack qing        #如我的项目名qing

プロジェクト名などの確認が表示されますので、「はい」「いいえ」を判断してください。例:

? Project name yes
? Project description yes
? Author yes
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recom
mended) npm
  vue-cli · Generated "qing".

3. プロジェクト ディレクトリを入力します。

cd qing   #如我的项目名qing

4. インストールの依存関係:

cnpm がインストールされている場合は、次を使用します:

$sudo cnpm install

インストールされていない場合は、次を使用します:

$sudo npm install

インストールが成功すると、次のプロンプトが表示されます:

up to date, audited 1854 packages in 39s
59 packages are looking for funding
 run `npm fund` for details
65 vulnerabilities (27 low, 19 moderate, 18 high, 1 critical)
To address issues that do not require attention, run:
 npm audit fix
To address all issues (including breaking changes), run:
 npm audit fix --force
Run `npm audit` for details.

5. すべてがインストールされたら、実行できます。毎回実行する前に、コマンドを使用して一度起動するのが最善です。

$sudo npm run dev

これは私がコンパイルしたメモですが、これは読むことができます。始めるのは簡単でしたが、多くの問題がありました初めてインストールしました。ネットワーキングも原因の一部です。一部のコマンドは壁を越えて実行する必要があります。

以上がノード、vue、およびその他の環境構成を MAC 環境にインストールするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。