Vue プロジェクトの構築、パッケージ化、公開についての詳細な説明

多くの友人は VUE プロジェクトの一連のプロセスに慣れていません。ネチズンからの質問に基づいて、編集者が VUE プロジェクトのビルド、パッケージ化、リリースの全プロセスを主に詳しく紹介します。 vue.js プロジェクトのパッケージ化とリリースのプロセス全体が、皆さんのお役に立てれば幸いです。

1. vue プロジェクトの作成

1. まず、Node.js と npm が必要です

2. スキャフォールディングをインストールします

2. vue プロジェクトのパッケージ化

ルート ディレクトリ: コンピュータのファイル システムでは、ルート ディレクトリは、サブディレクトリに対する相対的な論理ドライブの最上位ディレクトリを指します。大きな木の「ルート」であり、すべての枝はそこから始まるため、ルート ディレクトリと呼ばれます。 Microsoft が開発した Windows オペレーティング システムを例に挙げます。

マイ コンピューター (コンピューター) を開き、C ドライブをダブルクリックして C ドライブのルート ディレクトリに入ります。 DドライブをダブルクリックしてDドライブのルートディレクトリに入ります

build: {
  env: require('./prod.env'),
  index: path.resolve(__dirname, '../dist/index.html'),
  assetsRoot: path.resolve(__dirname, '../dist'),
  assetsSubDirectory: 'static',
  assetsPublicPath: './',
  productionSourceMap: true,
  // Gzip off by default as many popular static hosts such as
  // Surge or Netlify already gzip all static assets for you.
  // Before setting to `true`, make sure to:
  // npm install --save-dev compression-webpack-plugin
  productionGzip: false,
  productionGzipExtensions: ['js', 'css'],
  // Run the build command with an extra argument to
  // View the bundle analyzer report after build finishes:
  // `npm run build --report`
  // Set to `true` or `false` to always turn it on or off
  bundleAnalyzerReport: process.env.npm_config_report
 }

distルートディレクトリからインデックスファイルを開いてアクセスします。

3. Github ページ

2. ここでマスターまたは /doc を選択してマスターにコードをアップロードします

4. カスタムドメイン名

username.github.io/xxx /dist

のようなアドレスは、実際にはあまり美しくありません。Alibaba Cloud にアクセスして、自分でドメイン名を購入し、オンラインでカスタマイズできます。独自のブログを作成し、コードを github にデプロイします。
関連する推奨事項:

Vue プロジェクトを最適化する方法

vue プロジェクトの構築と実践例のチュートリアル

以上がVue プロジェクトの構築、パッケージ化、公開についての詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。