Webpack을 번들로 제공하지만 디버깅을 위해 축소하지 않고도 얻을 수 있습니까?

Question

어딘가에 답이 있어야하는 정말 어리석은 질문처럼 보입니다.하지만 몇 시간 동안은 검색하지 않았습니다. 나는 ReactJS를 처음 사용하고 Webpack으로 구축하고, 일반적으로 configs를 빌드한다. 나는 Webpack을 사용하여 ReactJS를 포함하여 전체 프로젝트를 링크하고 묶습니다. 그것은 훌륭하게 작동하지만 문제가 발생했을 때 문제를 디버깅 할 수 있도록 번들이 un-minified로 나오게하는 방법을 알 수는 없습니다. 내가해야합니까 무엇

{ 
    /* blah blah */, 
    "scripts": { 
    "start": "node ./bin/www", 
    "dev": "webpack -d --watch", 
    "build": "webpack -p" 
    }, 
    "dependencies": { 
    "babel-core": "^6.16.0", 
    "babel-loader": "^6.2.5", 
    "babel-preset-react": "^6.16.0", 
    "body-parser": "~1.15.1", 
    "cookie-parser": "~1.4.3", 
    "debug": "~2.2.0", 
    "express": "~4.13.4", 
    "helmet": "^3.1.0", 
    "morgan": "~1.7.0", 
    "mysql": "^2.11.1", 
    "querystring": "^0.2.0", 
    "react": "^15.3.2", 
    "react-dom": "^15.3.2", 
    "request": "^2.75.0", 
    "serve-favicon": "~2.3.0", 
    "webpack": "^1.13.2" 
    } 
} 

: 나는 내 package.json에서 다음에 전화하거나 npm run dev 또는 npm run build와 함께 번들 실행을 실행

var webpack = require('webpack'); 
var path = require('path'); 

var BUILD_DIR = path.resolve(__dirname, 'public/js'); 
var APP_DIR = path.resolve(__dirname, 'build-source/js'); 

var config = { 
    entry: APP_DIR + '\\main.js', 
    output: { 
    path: BUILD_DIR, 
    filename: 'build.js' // want this output file to end un-minified 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /\.jsx?/, 
     include: APP_DIR, 
     loader: 'babel' 
     } 
    ] 
    } 
}; 

module.exports = config; 

: 여기

내 웹팩 설정입니다 을 un-minified로 변경하십시오. 내 Webpack 실행 중 JavaScript 번들이 번들합니까?

Answer 1

당신이 웹팩의 CLI에 대한 -p 플래그를 사용하는 경우, 당신은 그래서 대신 UglifyJSPlugin(behind the scenes)

를 사용하는 웹팩을 말하고있다, 나는 -p 플래그없이 웹팩 실행하는 별도의 빌드 작업을 대신 통과 것 대신에 귀하의 설정에 따라.

var webpack = require('webpack'); 

module.exports = { 
    plugins: [ 
    new webpack.optimize.UglifyJsPlugin({ 
     options: { 
     compress: {drop_debugger: false} 
     } 
    }) 
    ] 
}; 

또한, 당신은 내가 (단지 UglifyJs의 compression options에 해당)을 UglifyJsPlugin에 사용자 정의 옵션을 통과 한 것을 볼 수 있습니다.