vue-cli3 と vue-cli2 の違いは何ですか-Vue.js-php.cn

vue-cli3 と vue-cli2 の違いは何ですか

WBOY

リリース： 2022-03-17 15:16:20

オリジナル

6146 人が閲覧しました

相違点: 1. 「vue-cli3」は webpack4 に基づいて構築されますが、「vue-cli2」は webpack3 に基づいて構築されます; 2. 「vue-cli3」は静的フォルダーを削除し、パブリックフォルダーを追加します。「index.html」を公開に移動しました。

vue-cli3 と vue-cli2 の違いは何ですか

この記事の動作環境: Windows 10 システム、Vue バージョン 2.9.6、DELL G3 コンピューター。

#vue-cli3 と vue-cli2 の違いは何ですか

vue-cli 3 の github ウェアハウスは、元の独立した github ウェアハウスから vue プロジェクトに移行されました

vue- cli 3 のプロジェクトアーキテクチャは、vue-cli 2 の元のアーキテクチャを完全に放棄します。 3 の設計はより抽象的かつ簡潔です (後で詳しく紹介します)

vue-cli 3 はベースになっていますwebpack 4、vue-cli 2、または webapck 3 では

#vue-cli 3 は vue ui コマンドを提供し、視覚的な設定を提供し、よりユーザーフレンドリーです

vue-cli 3 も学習しているためロールアップのゼロ構成のアイデアなので、プロジェクトが初期化されると、見慣れたビルドディレクトリはなくなり、webpack.base.config.js、webpack.dev.config.js、 webpack.prod.config.js。

vue-cli 3 の設計原則は 0 構成です。構成ファイルのルートディレクトリにある build ディレクトリと config ディレクトリが削除されます。

静的フォルダーが削除され、パブリックフォルダーが削除されます。そして、index.html は public に移動されました

#Vue-cli で作成されたプロジェクトのディレクトリ構造3

vue_project

-- node_modules #インストールされたライブラリの依存関係

-- public # vue-cli2 の static と同等、パッケージ化され、そのままの状態で dist に配置されます
-- src # ソースcode
-- .browserslistrc # ブラウザ関連の設定
## -- .gitignore # git 関連の設定。設定では一部を無視できます。 files
-- .babel.config.js # 構成 babel
# -- readme.md # マークダウンドキュメント
#スタートアッププロジェクトとパッケージ化プロジェクト
```
npm run serve
```
ログイン後にコピー
# パッケージ化プロジェクト
```
npm run build
```
ログイン後にコピー

{
  "name": "vue3test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    # 运行项目
    "serve": "vue-cli-service serve",
    # 打包项目
    "build": "vue-cli-service build"
  },
  # 运行依赖
  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^2.6.11"
  },
# 开发依赖
  "devDependencies": {
    "@vue/cli-plugin-babel": "^4.4.0",
    "@vue/cli-service": "^4.4.0",
    "vue-template-compiler": "^2.6.11"
  }
}

ログイン後にコピー