Webpack ファイルのエイリアスを設定し、vue でルーティングのデフォルト クラスを構成する方法

前回勉強中にデフォルトルートの設定という問題に遭遇しました

今回はwebpackファイルのエイリアスを設定し、ルートのデフォルトクラスを設定しました

まず、webpackファイルのエイリアスを設定します。エイリアスの設定は webpack.base.conf .js ファイルにあります。

resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'components': resolve('src/components')
    }
  },

を見つけて、エイリアスで設定します。

ファイルがコンポーネント内にある場合、

設定するときは、上で行ったように resolve('src/components') として記述できます。 このファイルの下にあるファイルをインポートする場合は、components/** を直接インポートしてください。

これはとても簡単です。

2. ルーティングのデフォルトクラスを設定します

これも非常に簡単な設定です。 vue-router のドキュメントにも説明があります。

設定したとき。デフォルトのルーティング クラスをアクティブに設定します。結局のところ、デフォルトのものは長すぎます。構成は次のとおりです。

export default new Router({
  linkActiveClass: 'active',
  routes: [
   ]
})

重要なポイントは、新しいルーティングのデフォルト クラス セットである linkActiveClass: 'active' です。

これにより、コードを記述するときにアクティブを直接使用できます。もっと便利ではないでしょうか？

以上がWebpack ファイルのエイリアスを設定し、vue でルーティングのデフォルト クラスを構成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。