Webpack output output multiple directories?

problem description

want to configure webpack to package multiple pages, but there is a hierarchical relationship between multiple pages. Can output output multiple levels?

the platform version of the problem and what methods you have tried

output has only been configured with pathname

related codes

/ / Please paste the code text below (do not replace the code with pictures)

what result do you expect? What is the error message actually seen?

webpack multi-page packaging

want to generate
index/index.html
index/content/content.html

news/news.html

Webpack

Dec.03,2021

absolutely. Use name of entry as appropriate splicing.
such as js :

filename: '[name]/[name].js'

css :

new MiniCssExtractPlugin({
  filename: '[name]/[name].css'
})

Previous: What is the difference between the two ways of writing react's Fragment,?

Next: C2S S2S reporting method?

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