今回は、vue-cli 3.0.x の使用手順について詳しく説明します。vue-cli 3.0.x を使用する際の 注意事項 は何ですか?実際のケースを見てみましょう。
1.公式サイトの情報
技術を学ぶときは必ず公式サイトの情報を確認してください。そこの情報が一番早く更新されるからです。vue-cli
vue-cli ドキュメント
2. インストール環境
ここでは、npm install -g @vue/cli と、yarn global add @vue/cli を使用することをお勧めします。その他の設定や、いくつかのファイルの生成npm install -g @vue/cli # or yarn global add @vue/cli # 使用vue命令,创建项目(不同于cli2.0的init,create) vue create my-project
yarn // 安装项目依赖 cd packages/@vue/cli // 目录 yarn link //添加 link `vue` 执行指命 。 vue create my-project // 创建项目 。
3. マルチ環境構成
会社には開発環境、テスト環境、共同デバッグ環境、オンライン環境があるため。手動構成を減らし、一度構成します。そのため、2.0.x では「package.json "tt": "node build/tt-build.js"」タイプの構成が追加され、多くのファイルを構成できませんでした。 vue-cli 3.0.x では、「.env」ファイル構成がサポートされています。ここでは「.env.development」、「.env.production」、および「.env.test」構成を追加しました。 1. 基本的な対応とデフォルトdevelopment is used by vue-cli-service serve production is used by vue-cli-service build test is used by vue-cli-service test
"dev-build": "vue-cli-service build --mode development",
設定ファイルを書き込みます
設定ファイルの内容の形式は次のとおりですVUE_APP_*
VUE_APP_MOCK_URL = 'https://xxx.xxx.xxx/restapi/'
console.log(process.env.VUE_APP_MOCK_URL); process.env.NODE_ENV // 特定 BASE_URL // vue.config.js 配置
以上がvue-cli 3.0.xを使用する手順の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。