Skip to main content
本文に 8 文字追加
ソース リンク
Faily Feely
  • 2,883
  • 1
  • 8
  • 18

質問者さんのおっしゃる通り、そのファイルでは

@import '@/assets/styles/mixin.scss';

@import '../assets/styles/mixin.scss';

と同じ意味だと思われます。この@が何なのかは、webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったらプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを参照できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。このような設定はvue.jsのプロジェクトで多く見られますが、Vue CLI 2時代のwebpackテンプレートでこのような設定が採用されていたことが理由だと考えられます。

参考:英語版Stack Overflowでの同様の質問

質問者さんのおっしゃる通り、

@import '@/assets/styles/mixin.scss';

@import '../assets/styles/mixin.scss';

と同じ意味だと思われます。この@が何なのかは、webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったらプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを参照できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。このような設定はvue.jsのプロジェクトで多く見られますが、Vue CLI 2時代のwebpackテンプレートでこのような設定が採用されていたことが理由だと考えられます。

参考:英語版Stack Overflowでの同様の質問

質問者さんのおっしゃる通り、そのファイルでは

@import '@/assets/styles/mixin.scss';

@import '../assets/styles/mixin.scss';

と同じ意味だと思われます。この@が何なのかは、webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったらプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを参照できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。このような設定はvue.jsのプロジェクトで多く見られますが、Vue CLI 2時代のwebpackテンプレートでこのような設定が採用されていたことが理由だと考えられます。

参考:英語版Stack Overflowでの同様の質問

本文に 132 文字追加
ソース リンク
Faily Feely
  • 2,883
  • 1
  • 8
  • 18

質問者さんのおっしゃる通り、

@import '@/assets/styles/mixin.scss';

@import '../assets/styles/mixin.scss';

と同じ意味だと思われます。この@が何なのかは、webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったら例えばプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを設定参照できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。このような設定はvue.jsのプロジェクトで多く見られますが、Vue CLI 2時代のwebpackテンプレートでこのような設定が採用されていたことが理由だと考えられます。

参考:英語版Stack Overflowでの同様の質問

webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったら例えばプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを設定できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。

参考:英語版Stack Overflowでの同様の質問

質問者さんのおっしゃる通り、

@import '@/assets/styles/mixin.scss';

@import '../assets/styles/mixin.scss';

と同じ意味だと思われます。この@が何なのかは、webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったらプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを参照できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。このような設定はvue.jsのプロジェクトで多く見られますが、Vue CLI 2時代のwebpackテンプレートでこのような設定が採用されていたことが理由だと考えられます。

参考:英語版Stack Overflowでの同様の質問

ソース リンク
Faily Feely
  • 2,883
  • 1
  • 8
  • 18

webpackの設定ファイルを見れば答えが載っているかと思います。

これはwebpackでパスに対するエイリアスを指定しているものと思われます。つまり、@と書いてあったら例えばプロジェクトのルートディレクトリを指すように設定しているのです。恐らく、そのファイルの場合は@が指し示す位置が..と同じなので、質問者さんの考察のようになるのではないかと思います。

このように設定することの利点は、どの位置のファイルからでも同じ方法でプロジェクトのルートディレクトリを設定できることです。../assets/styles/mixin.scssのように通常の相対パスを使うと、ファイルの位置によって..の数を変えなければいけなくなり面倒です。

エイリアスとして@を使わなければいけない理由はありませんが、ファイル名などに使われることが少なく他と混同されにくいことから選ばれているのではないかと思います。

参考:英語版Stack Overflowでの同様の質問