J'ai regardé similaire mais n'ai pas pu trouver une réponse concerete qui a résolu mon problème. Je ne trouve pas le fichier bundle.js même si je spécifie où il doit être sorti et que tout fonctionne dans le navigateur. Je comprends que le serveur webpack-dev charge les fichiers de la mémoire et que rien n'est écrit sur le disque, comment puis-je obtenir le fichier à construire et à ajouter au répertoire spécifié dans la propriété de sortie dans le fichier de configuration?

Voici mon package.json:

    {
    "name": "redux-simple-starter",
    "version": "1.0.0",
    "description": "Simple starter package for Redux with React and Babel support",
    "main": "index.js",
    "repository": "git@github.com:StephenGrider/ReduxSimpleStarter.git",
    "scripts": {
     "start": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js -- content-base build"
      },
      "author": "",
      "license": "ISC",
      "devDependencies": {
      "babel-core": "^6.2.1",
      "babel-loader": "^6.2.0",
      "babel-preset-es2015": "^6.1.18",
      "babel-preset-react": "^6.1.18",
      "react-hot-loader": "^1.3.0",
     "webpack": "^1.12.9",
     "webpack-dev-server": "^1.14.0"
     },
     "dependencies": {
     "babel-preset-stage-1": "^6.1.18",
     "react": "^0.14.3",
     "react-dom": "^0.14.3",
     "react-redux": "^4.0.0",
     "redux": "^3.0.4"
    }
    }

Config webpack:

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

    module.exports = {
     entry: [
       'webpack-dev-server/client?http://localhost:8080',
       'webpack/hot/only-dev-server',
       './src/index.js'
     ],
     output: {
       path: path.join(__dirname, 'assets'),
       publicPath: '/',
       filename: 'bundle.js'
     },
     module: {
       loaders: [{
         exclude: /node_modules/,
         loader: 'babel'
       }]
     },
     resolve: {
       extensions: ['', '.js', '.jsx']
     },
     devServer: {
       contentBase: './'
     },

     plugins: [
       new webpack.HotModuleReplacementPlugin()
     ]
    };       
7
Abdi 8 mars 2016 à 17:32

5 réponses

Meilleure réponse

Ce plugin de Webpack oblige le serveur à écrire le bundle sur le disque.

Bien que je sois d'accord avec Austin et lux, si vous avez besoin d'avoir le fichier sur le disque, appelez directement webpack.

4
Alejandro Napoles 12 mars 2016 à 17:40

Remplacez votre objet scripts du fichier package.json par le suivant:

"scripts": {
     "start": "npm run build",
     "build": "webpack -p && ./node_modules/webpack-dev-server/bin/webpack-dev-server.js -- content-base build"
},

Ensuite, exécutez $ npm start

0
solanki... 25 mars 2017 à 11:50

Lorsque vous utilisez le serveur de développement, la sortie est placée dessus. Vous ne le verrez donc pas réellement dans vos fichiers. À partir de votre fichier index.html, vous voudrez le charger depuis le serveur.

Par exemple, pour mon application, je charge dans le serveur de développement, mes fichiers fournisseur, puis mon propre code.

<script src="http://localhost:8080/webpack-dev-server.js"></script>
<script src="http://localhost:8080/build/vendor.js"></script>
<script src="http://localhost:8080/build/app.js"></script> 

Et voici la partie pertinente de ma configuration webpack. Il y a quelques bits hérités inutiles de l'époque où je le chargeais également à partir d'un bundle de construction statique.

  app: [
        'webpack/hot/dev-server',
        'webpack-dev-server/client?http://localhost:8080',
        './client/index.js'
        ]

},
output: {
    path: __dirname + '/client/build',
    publicPath: '/build/',
    filename: '[name].js',
    pathinfo: true
},
5
Austin Shoecraft 8 mars 2016 à 14:46

Vous pouvez également demander à webpack de regarder à l'aide d'un indicateur dans la configuration. Cela va générer le fichier bundle

module.exports = {
    watch: true,
};
0
Sun 17 déc. 2016 à 15:03

Inclure le script ci-dessous dans le fichier webpack.config.js

devServer: {
  writeToDisk: true
}
0
adiga 9 avril 2019 à 06:55