vueホワイトチュートリアル(一)継続更新

1744 ワード

vueプロジェクトは無から有へ
前端菜鳥のメモ
vueベースのプロジェクトの初期化(作成)
init:   (  )  vue   

vue init webpack hello:  webpack        hello vue  

vue-cli         ,  vue                    :

Project Name:        (        package.json  ,    name      ProjectName,
              ,       (      package.json name    ,        ,
  ,   ,     - )
Project Description:    ,     package.json   ,  

Author:  ,  

       

Install vue-router:    vue    ,          

Use ESLint to lint your code:      ESLint        
//        ,        ,                     

Setup unit tests with Karma + Mocha?:      (    )

Setup e2e tests with Nightwatch?:          


vue-cliで構成が完了すると、プロジェクトがインストールする依存パッケージはvue-cliツールで自動的に生成されるpackageである.jsonファイルには次の説明があります.
                 ,    npm       

            : cnpm install     --save    : cnpm install axios --save

 package.json    devDependencies           

dependencies:              
devDependencies:                 ,              

プロジェクト構造
  • buildディレクトリ:プロジェクトコマンドを構築するために使用するスクリプトファイルとプロファイル
  • configディレクトリ:vue-cliには小型のexpressで構築されたホットリロードウェブサーバが自動的にインストールされ、configにはこのサーバに関する構成
  • が含まれています.
  • distディレクトリ:プロジェクトコンパイル構築オンライン後の格納ディレクトリ
  • node_modulesディレクトリ:プロジェクト依存パッケージ格納ディレクトリ
  • srcディレクトリ:プロジェクトソースコード格納ディレクトリ
  • staticディレクトリ:静的リソース格納ディレクトリ
  • プロジェクト開発の過程で、私たちの大部分の任務はsrcというディレクトリの下で完成しました.
  • main.js:vue足場は、自動的に生成されたプロジェクトに設定されたエントリファイルです.このエントリファイルでは、いくつかのプロジェクトの初期化作業
  • が行われています.
  • Vue
  • を導入
  • は、必要なコンポーネント
  • を導入する.
  • Vueインスタンス
  • を作成する
    うんてん
    必要なインストール依存パッケージのインストールが完了すると、プロジェクトを開始し、実行できます.
    npm run dev:テスト開発環境npm run buildを開く:プロジェクトを構築し、プロジェクトをパッケージ化し、プロジェクトをパッケージ化したファイルをサーバにアップロードすることができます.
    rt.js/