html-webpack-plugin은 html-loader와 어떻게 작동합니까?

수입이 ed 또는 인 경우에만 어딘가에 d가 필요하고 리소스가 해당 로더와 일치 할 때만 로더가 호출되는 것으로 생각했습니다. html-webpack-plugin은 html-loader와 어떻게 작동합니까?

그러나 다음과 같은 코드의

, 아니 html 파일은 어디 가져 오지 않고 HTML 로더 때문에 HTML에서 밑줄 템플릿 물건의 컴파일 패스를 만들기 위해 여전히 필요하다.

그래서 나는 다음과 같은 질문이 :

html로 로더 재생 오는가? 번들이 생성되기 전이나 후에?
webpack이 html 로더를 호출하는 이유는 무엇입니까? 플러그인의 템플릿 설정 때문에?

플러그인에서 로더의 출력을 사용합니까? 그러나 출력은 단순한 문자열이며 어떻게 차이를 만들 수 있습니까?

//webpack.config.js 
const webpack = require('webpack'); 
const path = require('path'); 
const htmlPlugin = require('html-webpack-plugin'); 
module.exports = { 
    entry: { 
     a: './a.js' 
    }, 
    output: { 
    filename: '[name].[chunkhash].js', 
    chunkFilename: '[name].[chunkhash].js', 
    path: path.resolve(__dirname, 'dist') 
}, 
module: { 
    rules: [ 
    { 
     test: /\.html$/, 
     loader: "html-loader" 
    } 
    ] 
}, 
plugins: [ 
     new htmlPlugin({ 
     template:path.resolve(__dirname,'index.html') 

    }) 
] 
}; 

//index.html 
    <!DOCTYPE html> 
    <html> 
    <head> 
     <title></title> 
    </head> 
    <body> 
     <script id="item-template" type="text/template">  
     <label><%= title %></label> 
     </script> 

    </body> 
    </html>

출처

2017-12-27 Shawn Chen

나는 당신에게 최선의 질문에 대답하려고합니다 : html로 - 로더 HtmlWebpackPlugin에서 종속성이 없습니다

. require('./app.component.html') 다음과 같은 시험을 가지고 있기 때문에, : : 웹팩은 자바 스크립트에서 다음을 감지 할 때

는 HTML - 로더
는 활동하기 시작 /\.html$/. 기본 동작은 해당 파일의 html을 require가 명시된 위치에 두는 것입니다.
html 로더는 HtmlWebpackPlugin과 독립적입니다.
아는 한, 아니오.

난 당신이 조금 더 나은이 답변에 웹팩 이해를 바랍니다.

출처

2018-01-12 10:12:41 Cees

"require ('./ app.component.html')"자료를 조금 더 설명 할 수 있습니까? –

나는 이것을 내 자신의 말로 설명하려고 노력할 것이다. Webpack은 자바 스크립트를 '인덱싱'하고 필요가 발견되면 노드가 webpack에 대한 파일을 선택하고 webpack에 문자열로 표시하도록 허용하므로 webpack은이를 파이프 라인에 통합 할 수 있습니다. 또한, webpack이 require를 찾았을 때, 로더의 정규식과 같은 후 처리를하기 위해 연관 될 수있는 로더를 찾으려고 시도합니다. 너에게 이해가 되니? – Cees

귀하의 의견은 나에게 의미가 있습니다. 하지만 내 질문에 일찍 언급 한 것처럼 javascript 파일에는 require ("xxx.html")와 같은 내용이 포함되어 있지 않습니다. 질문은 왜 내 프로젝트는 여전히 컴파일하는 html 로더가 필요합니다. –

html-webpack-plugin은 html-loader와 어떻게 작동합니까?

답변

관련 문제