在 Laravel 7.0 設置 Vue 專案的路徑別名

做法

在專案根目錄新增 webpack.config.js 檔：

const path = require('path');

module.exports = {
  resolve: {
    extensions: [
      '.js',
      '.vue',
    ],
    alias: {
      '@': path.join(__dirname, '/resources/js'),
    },
  },
};

修改 webpack.mix.js 檔，引入 webpack.config 檔：

const mix = require('laravel-mix');
const config = require('./webpack.config');

mix.webpackConfig(config);

編輯器

使用 WebStorm 編輯器時，如果出現 Module is not installed 的錯誤訊息，可以開啟 Preferences 視窗，將 Webpack 的 webpack configuration file 路徑設置為 webpack.config.js 檔的路徑。

/Users/<USER>/Projects/<PROJECT>/webpack.config.js