Come impedire al webpack di generare file compilati nella directory sorgente

Question

Sto "migrando" il mio progetto AngularJs da ES6 a TypeScript e sto usando webpack con ts-loader.

Il problema è che i file compilati e le mappe delle fonti sono scritte nella mia cartella e non come il file bundle.js fornito dalla memoria quando si utilizza webpack-dev-server.

Invece di avere index.ts nella mia directory io alla fine con:

. 
├── index.js 
├── index.js.map 
└── index.ts 

si può fare?

mio tsconfig.json è:

{ 
    "compilerOptions": { 
    "target": "es6", 
    "sourceMap": true, 
    "module": "commonjs" 
    }, 
    "exclude": [ 
    "node_modules", 
    "src/dist" 
    ], 
    "version": "1.6.2" 
} 

e webpack.config.js è:

module.exports = { 
    context: PATHS.app, 
    entry: { 
    app: ['./index.ts'] 
    }, 
    output: { 
    path: path.resolve(__dirname, 'dist'), 
    filename: 'bundle.js' 
    }, 

    // add resolve clause:root 

    module: { 
    loaders: [ 
    { test: /\.ts$/, exclude: /node_modeuls/, loader: 'babel-loader!ts-loader' }, 
    { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' }, 
    { test: /\.less$/, loader: "style!css!less", exclude: /node_modules/ }, 
    { test: /\.html$/, loader: "html" }, 
    { test: /\.(ttf|eot|svg|otf)$/, loader: "file" }, 
    { test: /\.woff(2)?$/, loader: "url?limit=10000&minetype=application/font-woff" }, 
    { test: /\.jpe?g$|\.gif$|\.png$|\.svg$|\.woff$|\.ttf$|\.wav$|\.mp3$/, loader: require.resolve("file-loader") + "?name=../[path][name].[ext]"} 
    ] 
    }, 

    devServer: { 
    contentBase: "./src" 
    }, 

    devtool: '#inline-source-map' 

} 

Answer 1

credo che questo non è legato alla webpack ma tsc e IDE.

Probabilmente le origini vengono compilate automaticamente da IDE e per impostazione predefinita i risultati di compilazione vengono posizionati accanto ai file di origine.

Si può provare a disabilitare la compilazione automatica in IDE. La maggior parte degli IDE riconosce l'opzione compileOnSave. Impostalo su false in tsconfig.json e dovresti stare bene.

Esempio tsconfig.json

{ 
    "compilerOptions": { 
    "target": "es6", 
    "sourceMap": true, 
    "module": "commonjs", 
    "compileOnSave": false 
    }, 
    "exclude": [ 
    "node_modules", 
    "src/dist" 
    ], 
    "version": "1.6.2" 
} 

---

Si può anche provare ad aggirare definendo outDir nel vostro tsconfig.json.

Il vostro esempio tsconfig.json potrebbe assomigliare

{ 
    "compilerOptions": { 
    "target": "es6", 
    "sourceMap": true, 
    "module": "commonjs", 
    "outDir": "compiled" 
    }, 
    "exclude": [ 
    "node_modules", 
    "src/dist" 
    ], 
    "version": "1.6.2" 
} 

Ora tutti i risultati di compilazione verranno inseriti in compiled directory che può essere facilmente ignorata.