Question

我最近使用Nuxt.js和Typescript一起启动了一个新项目。我在nuxt.config.ts内设置别名，如下所示：

const config: NuxtConfiguration = {
  .....

  build: {
    /*
    ** You can extend webpack config here
    */
    extend(config, ctx) {
      // Run ESLint on save
      if (ctx.isDev && ctx.isClient && config.module) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue|ts)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        });
      }
      if (config.resolve && config.resolve.alias) {
        config.resolve.alias['@'] = path.resolve(__dirname, 'src');
        config.resolve.alias['~'] = path.resolve(__dirname, 'src');
      }
    },
  }
};
export default config;

在nuxt内部，它工作正常。我可以毫无问题地导入组件。但是，我的Eslint无法解析路径。

这是我的Eslint文件：

const path = require('path');
module.exports = {
  extends: [
    '@nuxtjs',
  ],
  env: {
    browser: true,
    node: true,
  },

  parserOptions: {
    parser: '@typescript-eslint/parser',
  },

  plugins: [
    '@typescript-eslint',
  ],

  settings: {
    'import/resolver': {
      webpack: {
        config: 'webpack.config.js',
      },
    },
  },
}

这是我的webpack.config.js。

const path = require('path');

module.exports = {
  resolve: {
    extensions: ['.js', '.json', '.vue', '.scss'],
    root: path.resolve(__dirname, 'src'),
    alias: {
      '@': path.resolve(__dirname, 'src'),
      '~': path.resolve(__dirname, 'src'),
    },
  },
};

有什么我想念的吗？

Eslint找不到Webpack别名的路径

0 个答案: