ホームページ  >  記事  >  ウェブフロントエンド  >  idea で vuejs プロジェクトを作成する方法

idea で vuejs プロジェクトを作成する方法

青灯夜游
青灯夜游オリジナル
2021-09-08 11:52:586319ブラウズ

作成方法: 1. ノードをインストールします; 2. アイデアを開き、「新しいプロジェクトの作成」-「静的 Web」をクリックし、プロジェクト名を入力して「Finis」をクリックします; 3. のターミナルを開きます。 vue スキャフォールディング ツールをインストールし、vue プロジェクトを初期化するだけです。

idea で vuejs プロジェクトを作成する方法

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

1. Vue.js には Node.js の基盤が必要です

1. ダウンロード アドレス: https://nodejs.org/en / download/
(通常のインストール手順に従ってください。次の手順は次の手順です~)

2. cmd (win R) を開き、次のコマンドを入力して、インストールが成功したかどうかを確認します。 ##

node -v
 npm -v

idea で vuejs プロジェクトを作成する方法

2. プロジェクトの構築を開始します

##1. アイデアを開いて新しいアイデアを作成しますプロジェクト

新しいプロジェクトの作成 > 静的 Web > プロジェクト名を入力し、保存したワークスペースを選択 > 完了

idea で vuejs プロジェクトを作成する方法

idea で vuejs プロジェクトを作成する方法

2. vue スキャフォールディング ツールをインストールします


·アイデアのターミナルを開きます

idea で vuejs プロジェクトを作成する方法この時点で、最初にターミナルのパスを変更し、それをローカル マシンの cmd パスに変更する必要があります。 ==>ファイル -> 設定 (変更後に再起動) (そうしないと、npm と vue が内部パスではないというエラーが発生します)コマンド):

idea で vuejs プロジェクトを作成する方法 変更後、次のコマンドを実行します。コマンド

//安装淘宝镜像
npm i -g cnpm --registry=https://registry.npm.taobao.org

·ダウンロードが完了するまで待ち、vue スキャフォールディングのインストールを続行します。ツールを使用して、引き続きターミナルで次のコマンドを入力します。

npm i -g vue-cli

インストールが成功したかどうかをテストします。

vue -V

スキャフォールディングのインストールが完了したら、パッケージ構造を初期化し、前に作成した新しいプロジェクトの名前として「

vue init webpack demo

demo」と入力し続けます。初期化すると設定されます。ここで設定を参照できます。

# 初期化が完了したら。ターミナルに「

idea で vuejs プロジェクトを作成する方法

cd demo
npm install (or if using yarn :yarn)
npm run dev

」と入力します。完了後、どのポートにアクセスできるかを尋ねるプロンプトが表示されます。現在は 8080

です。ブラウザを開いて次のように入力します。 : localhost: 8080 とすると、以下の画面が表示され、簡単なデモが完了します。

idea で vuejs プロジェクトを作成する方法

関連する推奨事項: 「idea で vuejs プロジェクトを作成する方法vue.js チュートリアル

以上がidea で vuejs プロジェクトを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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