왜 웹팩은 여전히 ​​이전 디렉토리 번들 파일을 생성합니까?

Question

진입 점이 ./src/app.js이고 출력이 ./public/dist/app.bundle.js 인 js를 컴파일하는 데 webpack을 사용하는 간단한 응용 프로그램이 있습니다.

는 이전에 출력 디렉토리 내가이 이전 경로 새 디렉토리뿐만 아니라 파일 ./dist/app.bundle.js에 생성 SRC 코드에 약간의 수정을 언제든지 웹팩 --watch 모드에 ./dist/app.bundle.js

했다?

이

var path = require("path"); 

module.exports = { 
    entry: path.resolve(__dirname, "./src/app.js"), 

    output: { 
     path: path.resolve(__dirname), 
     filename: "./public/dist/app.bundle.js", 
     publicPath: "/public/", 
    } 
}; 

NPM -v 3.10.10

노드를 webpack.config.js 어떤 문제가 있는지 알려주십시오 -v v6.10.2

웹팩 : 3.10.0

Answer 1

아래와 같이 webpack.config에 output 설정을 조정하십시오.

var path = require("path"); 

module.exports = { 
    entry: path.resolve(__dirname, "./src/app.js"), 

    output: { 
     path: path.resolve(__dirname, "public/dist"), 
     filename: "[name].bundle.js", 
     publicPath: "/public/", 
    } 
}; 

은 참조 : Webpack Output

Answer 2

var path = require("path"); 

module.exports = { 
    entry: path.resolve(__dirname, "./src/app.js"), 

    output: { 
     path: path.resolve(__dirname, "public/dist"), 
     filename: "app.bundle.js", 
     publicPath: "dist", 
    } 
}; 

output.filename
는 디스크의 각 출력 파일의 이름을 지정합니다. 여기에 절대 경로를 지정하면 안됩니다! output.path 옵션은 파일이 기록되는 디스크의 위치를 ​​결정합니다. filename은 개별 파일의 이름을 지정하기 위해서만 사용됩니다.

output.path
절대 경로로 출력 디렉터리 (필수). 브라우저에서 참조 할 때

output.publicPath
publicPath는 출력 파일의 공개 URL 주소를 지정합니다. <script> 또는 <link> 태그 또는 이미지와 같은 참조 애셋을 포함하는 로더의 경우 에 지정된대로 디스크상의 위치와 다른 경우 또는 url()으로 파일에 사용됩니다. 이 기능은 다른 도메인이나 CDN에서 일부 또는 모든 출력 파일을 호스팅하려는 경우 유용 할 수 있습니다. Webpack Dev Server는 또한 이것을 사용하여 출력 파일이 제공 될 것으로 예상되는 경로를 결정합니다.

는 정교하게 here