nuxt2.0 设置 webpack 路径别名

最新推荐文章于 2025-09-10 21:41:22 发布

原创最新推荐文章于 2025-09-10 21:41:22 发布 · 3.9k 阅读

2 ·

CC 4.0 BY-SA版权

本文介绍如何在Nuxt项目中通过配置nuxt.config.js来使用来自其他文件的组件路径，如components目录下的组件，通过修改resolve.alias实现路径别名化。

如果想在nuxt中直接使用其他文件的路径，比如下面的components，我们需要在nuxt.config.js进行配置即可。

import SiteHeader from 'components/site/SiteHeader.vue'

 build: {
    /*
    ** You can extend webpack config here
    */
    extend(config, ctx) {
      // Run ESLint on save
      if (ctx.isDev && ctx.isClient) {
        config.module.rules.push()
      }
      config.resolve.alias['components'] = path.resolve(__dirname, 'components')
    }
  }