Instructions for use

Configure the vue Config JS, taking setting alias as an example
1. Use chainWebpack configuration, such as

const path = require("path");
function resolve(dir){
    return path.join(__dirname,dir)
};
module.exports = {
    chainWebpack: (config) => {
        config.resolve.alias
        // set(key,value)
        .set("test",resolve('./src/test'))
    }
}

2. Use the object form configuration of the configureWebpack method, such as

module.exports = {
    configureWebpack:{
        resolve: {
            alias: {
              'test': resolve('./src/test')
            }
          }
    }
}

3. Use the function form of configureWebpack method to configure, such as

module.exports = {
    configureWebpack:config=>{
        config.resolve.alias['test2']=resolve('./src/test2')
    }
    
}

Or return an object to be merged

onfigureWebpack: config => {
     return {
            resolve: {
                alias: {
                    'test2': resolve('./src/test2')
                }
            }
        }
    },

The settings of the above three methods will be merged together

resolve.alias

An alias is used to map the original import path to a new import path.
Example above
alias also supports narrowing the scope to only hit import statements ending in keywords through the $symbol:

alias: {
  xyz$: path.resolve(__dirname, 'path/to/file.js')
}
import Test1 from 'xyz'; // Exact match, so path/to/file JS is parsed and imported
import Test2 from 'xyz/file.js'; // Inexact matching, triggering common parsing

Supplement:

// If the imported path does not specify any files, test/index JS
// If test does not have a path configured, the node is imported_ Modules/test/index JS
import "test"

resolve.aliasFields

Specify a field, for example, to be parsed by browser. Default:

aliasFields: ["browser"]

resolve.cacheWithContext

This solves the problem of performance degradation

resolve.descriptionFiles

Configure the file name that describes the third-party module, that is, package JSON file
The default is as follows:

descriptionFiles: ["package.json"]

resolve.enforceExtension

If it is configured as true, all import statements must have a file suffix. For example, import "./test" can work normally before startup, and it must be written as import "./test.js" after startup
Default:

enforceExtension: false

resolve.enforceModuleExtension

enforceModuleExtension and enforceextents have similar functions. But it is only effective for modules under node modules.
When enforceExtension:true, because most import statements in the installed third-party modules do not have file suffixes, configure enforceModuleExtension:false to be compatible with the third-party modules.
Default:

enforceModuleExtension: false

resolve.extensions

Configure the list of suffixes used in the attempt,
The default is:

extensions: [".js", ".json"]

For example, if you import "./test", the webpack will first look for the "./test.js" file. If it cannot be found, it will look for "./test.json". If it cannot be found, it will report an error

resolve.mainFields

Some third-party modules provide several copies of code for different environments. For example, two copies of ES5 and ES6 codes are provided respectively, and the positions of these two codes are written in package JSON file

{
    "jsnext:main":"es/index.js",//Code entry file with ES6 syntax
    "main":"lib/index.js" //Code entry file with ES5 syntax
}

If the target specified in the webpack configuration is different, the default value will be different. When the target attribute is set to webworker, web or not specified, the default value is:

mainFields: ["browser", "module", "main"]

For any other target (including node), the default value is:

mainFields: ["module", "main"]

If you want to preferentially adopt the code of ES6, you can configure it as follows:

mainFields: ["jsnext:main","browser", "main"]

resolve.mainFiles

The file name to use when resolving directories. default

mainFiles: ["index"]

resolve.modules

Tell webpack the directory that should be searched when parsing the module.
Default is

modules: ["node_modules"]

If you want to add a directory to the module search directory, this directory takes precedence over node_modules/ search:

modules: [path.resolve(__dirname, "src"), "node_modules"]

resolve.unsafeCache

When enabled, the module is actively cached, but it is not secure. Passing true caches everything. Default:

unsafeCache: true

Regular expressions, or arrays of regular expressions, can be used to match file paths or cache only certain modules. For example, cache only the utilities module:

unsafeCache: /src\/utilities/

resolve.plugins

List of additional parsing plug-ins that should be used. It allows plug-ins such as DirectoryNamedWebpackPlugin

plugins: [
  new DirectoryNamedWebpackPlugin()
]

resolve.symlinks

Whether to resolve symlinks to their symlink location. (?????????????????????????????????????????) default:

symlinks: true

resolve.cachePredicate

A function that determines whether the request should be cached. The function passes in an object with the path and request attributes. Default:

cachePredicate: function() { return true }

resolveLoader,

This set of options is the same as the attribute set of the resolve object above, but is only used to parse the loader package of the webpack. Default:

{
  modules: [ 'node_modules' ],
  extensions: [ '.js', '.json' ],
  mainFields: [ 'loader', 'main' ]
}

resolveLoader.moduleExtensions

If you really want to omit -loader, that is, only use example, you can use this option to implement:

moduleExtensions: [ '-loader' ]