1.インストールVUE-CLI 3.0
|
1
2
3
|
npm install -g @vue/cli
# or
yarn global add @vue/cli
|
VUE -V（大文字V）：正常にインストールビューバージョンの後
2.変更コマンド
|
1
|
vue create --help
|
使用法：create [options] <app-name>
`VUE-CLI-service`新しいプロジェクトでのサポートを作成します。
オプション：
-p、--preset <presetName>保存したり、リモートの設定オプションは、プロンプトを無視して使用し
、-dプロンプトを無視し、デフォルト設定のオプションを使用--default
-i、--inlinePreset <JSON>プロンプト無視インラインJSON文字列のプリセットオプション使用
-m、--packageManager <コマンド> NPM指定されたクライアントのインストールに依存する
だけで（依存インストール時に指定した-r、--registry <URL> NPMのレジストリを）NPMクライアントの
-g、 - Gitの[メッセージ]強制/ Gitは初期化され、指定スキップ提出初期設定オプションの情報
-n、--no-のgit gitのスキップ初期化
-f、--force上書き先のディレクトリ可能な構成の
-c、--clone使用gitのクローンは、プリセットのオプションは、リモート得る
-x、指定したプロキシを使用してプロジェクトを作成し--proxy
-bは、プロジェクトを作成するとき--bare省略時のデフォルトの初心者のアセンブリ命令を
-時間、--help出力ヘルプ情報の利用
3.プロジェクトを作成します。
プロジェクトを作成するために、指定したディレクトリに移動します（プロジェクト名：プロジェクト名）
|
1
|
vue create project-name
|
私のデフォルトは、私が保存されていた良いテンプレートです。
デフォルトでは、デフォルトの設定であります
手動で選択カスタム構成を備えて
4.設定（カスタム設定）を選択します
5. CSSプリコンパイルを選択して、私はあまりを選びました
|
1
2
3
4
5
6
|
Please pick a preset: Manually select features
Check the features needed
for
your project: Router, Vuex, CSS Pre-processors, Linter, Unit
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by
default
):
SCSS/SASS
> LESS
Stylus
|
6.シンタックス検出ツール、私はESLint +標準設定を選択しました
|
1
2
3
4
5
6
7
8
|
Please pick a preset: Manually select features
Check the features needed
for
your project: Router, Vuex, CSS Pre-processors, Linter, Unit
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by
default
): Stylus
Pick a linter / formatter config: (Use arrow keys)
ESLint
with
error prevention only
ESLint + Airbnb config
> ESLint + Standard config
ESLint + Prettier
|
7. [シンタックスチェックモード、ここで私は検出するために、それを保存することを選択します
|
1
2
3
4
5
6
7
|
Please pick a preset: Manually select features
Check the features needed
for
your project: Router, Vuex, CSS Pre-processors, Linter, Unit
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by
default
): Stylus
Pick a linter / formatter config: Prettier
Pick additional lint features: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>( ) Lint on save
// 保存就检测
( ) Lint and fix on commit
// fix和commit时候检查
|
8.次は、別のフォルダに、バベルをお願いpostcss、これらのプロファイルを置くeslint、ここで選ぶ、私が選択します
|
1
2
3
4
5
6
7
8
9
|
Please pick a preset: Manually select features
Check the features needed
for
your project: Router, Vuex, CSS Pre-processors, Linter, Unit
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by
default
): Stylus
Pick a linter / formatter config: Prettier
Pick additional lint features: Lint on save
Pick a unit testing solution: Jest
Where
do
you prefer placing config
for
Babel, PostCSS, ESLint, etc.? (Use arrow keys)
> In dedicated config files
// 独立文件放置
In package.json
// 放package.json里
|
私は、デフォルトの名前を保存するための最初のステップを見てあなたはYを入力した場合、Nは、記録しません9.は、保全の名前を入力する必要があります
|
1
2
3
4
5
6
7
8
|
Please pick a preset: Manually select features
Check the features needed
for
your project: Router, Vuex, CSS Pre-processors, Linter, Unit
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by
default
): Stylus
Pick a linter / formatter config: Prettier
Pick additional lint features: Lint on save
Pick a unit testing solution: Jest
Where
do
you prefer placing config
for
Babel, PostCSS, ESLint, etc.? In dedicated config files
Save
this
as a preset
for
future projects? (Y/n)
// 是否记录一下以便下次继续使用这套配置。
|
10.ダウンロードモジュールのために、依存待ち時間を決定した後
プロジェクトが作成された後11
|
1
2
|
cd project-name
// 进入项目根目录
run serve
// 运行项目
|
オープンする12.ブラウザ にhttp：// localhostを：8080
概要
上記は、こんにちは、私たちはあなたが私にメッセージをお願いします質問があれば、助けたい構築するためのプロジェクトを紹介するプロセスVUE-cli3.0足場小さなシリーズで、小扁は、速やかに全員に返信させていただきます。これで私はまた、家庭サイトスクリプティングのサポートのために非常に感謝しています！