記事ディレクトリ
これ以上ナンセンスはやめて、すぐに本題に進みましょう
1. まず vue-cli スキャフォールディングを理解する
vue-cli は、Vue.js に基づいた迅速な開発のための完全なシステムです。
Vue-cli は webpack に基づいて vue フロントエンド モジュール エンジニアリング環境 webpack を構築し、主要な Web ページの依存関係を Webpack の依存関係に変更します。Web ページの依存関係を main.js エントリ ファイルにインポートするだけで済みます。ブラウザ上で実行する
URL:はじめに | Vue CLI
2.足場の設置
npm install -g @vue/cli注: ノードのバージョンを確認してください。v14 以降である必要があります。
3. プロジェクトを開始する
名前:
vue プロジェクト名を作成する
注: 作成されたディレクトリ内の他のファイル名には vue を含めることはできません。また、キャメルケースの名前付けを使用することはできません。また、2 つの単語を区切るには「-」を使用してください。
コマンドが正常に実行されると、次のインターフェイスが表示されます。
デフォルトでインストールするか、独自の設定でインストールするかを選択できます。
ここでは 3 番目のオプションである手動インストールを選択します
次に、対応する構成を選択するように求められます。次のオプションをチェックし、スペースを使用してチェックし、すべての選択が完了したら Enter キーを押して確認します。
ここでは 2.x を選択し、ニーズに応じて選択してください
履歴モード ルーターを使用しますか? [はい] を選択します
CSSプリコンパイラーを選択します。ここではsassを選択します
リンター/フォーマッタ構成を選択します: ここでは標準構成が選択されています
選択した構成を保存するかどうかを尋ね、ここで保存することを選択します
Babel、ESLint などの設定をどこに置きますか? ここでは、専用の設定ファイルを選択し、新しい設定ファイルを作成します
選択した構成を記憶し、今後のプロジェクト作成で使用し、保存するかどうかを尋ねる場合は、ここで保存することを選択します
名前を付けて記録しておくと、次回から簡単に見つけることができます
起動に成功したことを示す以下の内容が表示されます。
プロジェクト フォルダーを入力し、cmd コマンド ラインでコマンドを実行します。注: プロジェクト フォルダーに移動する必要があります。
npm 実行サーブ
この内容はプロジェクトの起動が完了したことを示しているようです。
要約する
vue プロジェクトの開始プロセス中には、まだ注意が必要な細かい点がいくつかあるため、友人は慎重にインストールする必要があります。