What's the use of webpack aliasfields?

Business background

in the process of using mpvue
found that his webpack configuration file contains the following line of code

  ...
  resolve: {
    ...
    aliasFields: ["mpvue", "weapp", "browser"],
  },

situation description

went to the official website to search, but it was relatively brief, and I didn"t understand

official link to an English document https://github.com/defunctzom.
probably took a look at it, but I don"t quite understand

my question

does his browser have to be configured in package.json before it takes effect?
is equivalent to that if the content of alias is too complicated, can you separate it by aliasFields ?

Webpack

Nov.29,2021

answer to question 1
the default value for aliasFields is ['browser'], so as long as the package.json of the referenced module has a browser field, webpack packages the module with an "alias" defined using the browser field. In a nutshell, the browser can only be produced in the package.json configuration of the referenced module, and only for this module .

answer to question 2
alias can be thought of as a global alias configuration, which replaces not only the source code of the project, but also the module referenced by it.

The content of

alias is too complex, so you can extract it through aliasFields and write it separately

it is not a big problem to elaborate on this point of view. But one thing to be clear is that aliasFields points to the package.json of the module rather than the pakcage.json of the current project.

To make a long story short, the difference between alias and aliasFields should be in scope. AliasFields can do fine granulation treatment.

Previous: Mongodb cannot start error code 48 after binding IP

Next: Vue-resource cross-domain problem

Using HtmlWebpackPlugin to dynamically inject compiled files, output settings are useless
study online tutorials learn to package projects using webpack, a simple code implementation. the entry file index.html of the interface is as follows: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&qu...

Javascript webpack

Feb.26,2021
Webpack package react, error its MIME type ('text/html') is not executable
< H1 > github address < H1 > error will be reported when using npm run dev const path = require( path ); const merge = require( webpack-merge ); const common = require( . webpack.common.js ); dev-server let BundleAnalyzerPlugin = require( ...

React.js webpack

Feb.26,2021
React build Times wrong: syntax error: Unexpected token (26:6)
the npm start command runs normally, but the error will be reported when executing with npm run build as follows: syntax error: Unexpected token (Unexpected token (26:6) my index.js: import React, { Component } from react ; import ReactDOM from...

Webpack react.js javascript

Feb.27,2021
Global URL,dev.env.js in vue-cli
how to set the global URL here, you can use both in the development environment and online. ...

Html5 webpack

Feb.27,2021
Projects built with vue-cli always report errors when introducing static third-party plug-ins, and the path should be correct. Index.js has not changed.
...

Vue.js webpack vue-cli

Feb.27,2021
After vue-router lazily loads the configuration, the page becomes a blank page for solution and guidance.
after vue-router lazy loading configuration, the page becomes blank this problem does not occur when lazy loading is not configured, when configuring lazy loading *const product = resolve => { require.ensure([ . pages product.vue ], () =>...

Webpack vue-router

Feb.27,2021
Require fs module in the project, using webpack, but always reporting errors?
require the fs module in the front-end project, but keep reporting errors? fs.readFileSync is not a function introduce code var fs = require( fs ); fs.readFileSync( index.html , utf8 ); this is the webpack configuration file const path = re...

Angularjs webpack

Feb.27,2021
How do I use webpack-dev-server proxyTable.bypass?
there is a bypass Filter in proxyTable. How do I use it? Is it the return path? Or return true false ...

Webpack front-end

Feb.27,2021
Report to babel of undefined after webpack4.1 configuration is completed
webpack project upgrade version configuration is as follows: webpack.json "scripts": { "dev": "webpack --mode development", "build": "webpack --mode production", "watch": &quo...

Node.js webpack javascript

Feb.27,2021
Webpack4 can't use dynamic import?
according to the demo in ...

Webpack

Feb.27,2021
React loading style causes echarts width calculation error?
has the following react components: import ". Home.scss"; class Home extends React.Component{ render(){ return ( <div className="box clearfix"> <div className="left"> ...

Webpack react.js javascript

Feb.28,2021
Webpack separates and packages the image referenced in css,css separately. How to solve this problem?
now my project is to package css and js separately, and the directory structure after packaging is the same as before. before packing: csscssimages.. csscss.. .. : webpack.config.js csscss csscss I would like to ask all the great gods, what ...

Webpack vue.js javascript

Feb.28,2021
What is the role of node in vue scaffolding webpack configuration?
question: when I use vue2.5.2 scaffolding to generate a webpack project, I find that it has a configuration node under the automatic generation file build webpack.base.conf.js. What is it and what is it for? ...

Webpack vue.js

Feb.28,2021
How does create-react-app support es7's stage-0 proposal without eject?
refer to antd s custom scheme, introduce babel-plugin-import and react-app-rewired, and add .bablrc file, but not successfully is it necessary to eject? how to make create-react-app support stage-0, without eject? ...

Javascript webpack create-react-app react.js

Feb.28,2021
Vue element project, optimization for third-party js libraries. Cdn is introduced into vue.js,. Some content in the interface cannot be loaded.
introduce vue.min.js webpack.base.conf.jsexternalsvue tabletable into index.html according to the version used if import vue, removes externals and introduces cdn in main.js, it will load normally could you tell me what s wrong with my use? ...

Webpack element-ui vue.js

Feb.28,2021
It doesn't work to use proxy in webpack's devServer to solve cross-domain problems.
use webpack to open the front page on the local localhost:8080 port proxy is configured like this: devServer: { port: 8080, contentBase: . dist , proxy: { abc : { target: http: 122.79...

Ajax Cross-domain Agent webpack-dev-server webpack

Feb.28,2021
What are the advantages and disadvantages of css packaged directly in webpack and introduced in link form?
you can develop css, independently and introduce it in the form of link, and the other is webpack development, which is packaged directly to the corresponding page, so what are the advantages and disadvantages of these two ways? ...

Webpack html css

Feb.28,2021
How does laravel-mix package css and js in blade files
in the laravel project, when using the blade template, you often use @ section ( style ) on the page. <style type="text css"> < style> @ endsection or @ section ( script ) <script type="text javascript"> &...

Webpack php javascript

Feb.28,2021
Vue project cannot run problem
it was fine when the computer was turned off yesterday, and that s how it started today ...

Webpack vue.js

Feb.28,2021
Webpack4.0 npm script uses-- mode development to set development mode and production mode
use webpack4.0 to package npm script "webpack --mode development --config webpack.config.dev.js --progress --colors " tell me how to use the-- mode field in the configuration file code to make a judgment ...

Webpack

Feb.28,2021