vue中,@import后ろの波号~はどういう意味ですか

1019 ワード


このような状況は、vueプロジェクトでよく見られます.
@import '../../../../assets/css/varibles.scss'

以下に略記できます.
@import '~@/assets/css/varibles.scss'

ここの~記号.表示後の値はaliasで、build/webpackに行きます.base.conf.jsのalias構成では、対応する値を探し、最後のアドレスに接続します.
resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
    }
  }

もちろんbuild/webpackでもいいです.base.conf.jsのalias は、scssなどのカスタム文字を構成します.
resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'scss': resolve('src/assets/css'),
    }
  }

次に、次の操作を行います.
メールでjsまたは他のコンポーネントで使用できます
@import '~scss/varibles.scss'