Eclipseはvueをサポートしていますか?

eclipse は vue をサポートしており、CodeMix プラグインをインストールすることで Vue を開発できます; インストール方法: 1. [ヘルプ] -> [Eclipse MarketPlace] を選択します; 2. 検索ボックスに vue と入力し、 codeminx プラグインを選択し、「インストール」をクリックするだけでインストールできます。

このチュートリアルの動作環境: Windows10 システム、Eclipse2020&&vue2.9.6 バージョン、Dell G3 コンピューター。

関連する推奨事項: 「vue.js チュートリアル 」

eclipse は vue をサポートしており、CodeMix プラグインをインストールすることで Vue を開発できます。

CodeMix は、VS Code および Code OSS アドオン拡張機能のさまざまなテクノロジーのロックを解除し、さまざまな言語をサポートし、Webclipse のお気に入りの機能 (ライブ プレビューと CodeLive を備えたターミナルを含む) を備えた Eclipse のプラグインです。 ）。さらに、CodeMix は Eclipse ベースの IDE やツール (MyEclipse、Spring Tools Suite、JBoss Tools など) とも互換性があるため、ユーザーは使い慣れた環境で作業を続けることができます。

手順:

1.node.js と npm

1. インストール

公式から直接ダウンロードするだけです。ウェブサイトで、必要なバージョンを選択してください。通常、Windows の場合は以下のバージョンを選択できます。

# ダウンロードしたプログラムをクリックし、「次へ」をクリックしてインストールします。

必要に応じてインストール パスを変更しても問題ありません。インストールするまで次へ進みます。インストールが完了しました。finish

インストールが完了すると、ディレクトリが表示されます。

コマンド ラインを使用して、インストールが成功したかどうかを確認できます。キーボード入力 [win R] 入力: cmd、Enter キーを押し、次のコマンドを入力します:

node -v
 npm -v

インストールされているバージョン番号を表示します

注: ノードをインストールするとき、npm は次のコマンドも実行します。インストールされ、すべて一緒になりました。

2. 環境変数の設定: 環境変数を設定する目的は、npm パッケージが C ドライブに配置され、将来的に C ドライブの領域を占有することを防ぐことです。そのため、通常は完全なモジュール パスを配置します。

新しいフォルダー:

node_global グローバル パッケージのダウンロードとストレージ

node_cache ノード キャッシュ

npm パスを設定し、cmd 入力を開きます。

npm config set prefix “D:\soft\nodejs\node_global”
npm config set cache “D:\soft\nodejs\node_cache”

次に、環境変数を設定します。

ユーザー変数のパスを D:\soft\nodejs に変更します。 \node_global

次のように変更します:

システム変数 [新規]、[NODE_PATH] をクリックします。 、変数値は次のとおりです: D:\soft\nodejs\node_modules

最後に忘れずに [OK] をクリックしてください。

これまでのところ、ノード環境はインストールされており、npm パッケージ マネージャーも利用可能です。一部の npm リソースがブロックされているか、外部リソースであるため、npm は依存パッケージのインストールに失敗することがよくあります。 npm の国内ミラー----cnpm.

次の点に注意してください。インストール プロセス中にエラーが発生した場合は、コマンドをさらに数回試すか、コマンド ウィンドウを閉じて再度開くことができます。オンラインでは動作しないという大きな落とし穴があるため、4g に変更して再試行する必要があります。これらは私が個人的に経験した問題です。

コマンド ラインに「npm install -g cnpm --registry=http://registry.npm.taabao.org」と入力して待ちます。エラーが報告されなければ、インストールは成功です

cnpm install -g vue-cli–vue をインストールします

vue -V (大文字)-インストールされているかどうかを介してバージョンを表示します。成功しました

cnpm install webpack -g-install webpack

webpack -v - インストールが成功したかどうかをテストします。次に、「yes」と入力します。リソースは自動的にダウンロードされます。

小さなプロジェクトをテストします:

インストールされたnodejsフォルダーの下に新しいフォルダーを作成します:nodeTest

cmdウィンドウ切り替えGo vue init webpack firstApp – 完全なプロジェクトを初期化します

プロンプトに従ってプロジェクト情報を入力します。具体的な意味は自分で検索できます。 。

# 正常に作成されました。

cd firstApp - プロジェクトの入力

cnpm install の実行 - 依存関係のインストール

最後に npm run dev を実行してプロジェクトを開始します。

2. vue プラグインをインストールします

Eclipse-version 2020 と互換性があります

最初の準備:

ワークスペースで 2 つのファイル (.classpath と .project) を見つけ、それらを新しく構築されたプロジェクト firstApp

にコピーし、.project ファイルを開いて、ファイルのコンテンツ名をプロジェクト名に変更します。 firstApp

Eclipse を開き、ファイル - インポート - 以下のものを選択します

「次へ」をクリックして、作成したプロジェクト firstApp を選択してボックスをチェックします

ついに完了

次のステップは、Eclipse に vue プラグインをインストールすることです

Help-Eclipse Marketplace... 検索してください。 (ネットワーク速度の問題により、インストールが失敗した可能性があります。もう一度お試しください)

#インストールが完了したら、再起動すれば問題ありません。 ！

最後にテストします。

ブラウザの上記のコマンド ウィンドウに入力したコマンドを入力します: npm run dev その後に返される URL: http://localhost:8080

その後、エンコードを開始できます。 。 。

プログラミング関連の知識について詳しくは、

プログラミング教育

をご覧ください。 ！

以上がEclipseはvueをサポートしていますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。