J'essaie d'utiliser Webpack pour gérer les fichiers de mon projet. J'utilise webpack-dev-server _ et bower-webpack-plugin_. Lorsque j'exécute le serveur, une erreur se produit dans la console du navigateur.
Module introuvable: Erreur: Impossible de résoudre le module 'serveur'} _
webpack.config.js
const BowerWebpackPlugin = require("bower-webpack-plugin");
module.exports = {
entry: './src/script/index.jsx',
output: {
filename: 'bundle.js', //this is the default name, so you can skip it
//at this directory our bundle file will be available
//make sure port 8090 is used when launching webpack-dev-server
publicPath: 'http://localhost:8090/assets'
},
devtool: 'source-map',
module: {
loaders: [
{
test: /\.js[x]?$/,
loaders: ['react-hot', 'jsx', 'babel'],
exclude: /node_modules/
},
{
test: /\.scss$/,
loaders: [ 'style', 'css?sourceMap', 'sass?sourceMap' ]
}
]
},
plugins: [
new BowerWebpackPlugin()
],
externals: {
//don't bundle the 'react' npm package with our bundle.js
//but get it from a global 'React' variable
'react': 'React'
},
resolve: {
extensions: ['', '.js', '.jsx'],
modulesDirectories: ["./src", "node_modules", "bower_components"]
}
}
Edit: J'utilise maintenant cette configuration webpack sans bower-webpack-plugin
package.json
{
"scripts": {
"start": "npm run serve | npm run dev",
"serve": "./node_modules/.bin/http-server -p 8080",
"dev": "webpack-dev-server --progress --colors --port 8090"
},
"name": "Wonder",
"version": "0.0.0",
"description": "Internal app",
"main": "./src/script/index.jsx",
"author": "and",
"license": "ISC",
"devDependencies": {
"babel-core": "^5.8.22",
"babel-loader": "^5.3.2",
"bower-webpack-plugin": "^0.1.8",
"css-loader": "^0.16.0",
"extract-text-webpack-plugin": "^0.8.2",
"http-server": "^0.8.0",
"jsx-loader": "^0.13.2",
"node-sass": "^3.2.0",
"path": "^0.11.14",
"react": "^0.13.3",
"react-hot-loader": "^2.0.0-alpha-2",
"reinstall": "^1.1.0",
"sass-loader": "^2.0.1",
"style-loader": "^0.12.3",
"webpack": "^1.11.0",
"webpack-dev-server": "^1.10.1"
}
}
sortie de la console du navigateur
Uncaught Error: Cannot find module "server"
webpackMissingModule @ bootstrap 19214e8f07aa8a69f314:39
(anonymous function) @ bootstrap 19214e8f07aa8a69f314:39
__webpack_require__ @ bootstrap 19214e8f07aa8a69f314:19
(anonymous function) @ bootstrap 19214e8f07aa8a69f314:39
(anonymous function) @ bootstrap 19214e8f07aa8a69f314:39
webpack-dev-server.js:1 [WDS] Errors while compiling.
webpack-dev-server.js:1 multi main
Module not found: Error: Cannot resolve module 'server' in /Users/and/devel/webpack_test
resolve module server in /Users/and/devel/webpack_test
looking for modules in /Users/and/devel/webpack_test/src
/Users/and/devel/webpack_test/src/server doesn't exist (module as directory)
resolve 'file' server in /Users/and/devel/webpack_test/src
resolve file
/Users/and/devel/webpack_test/src/server.js doesn't exist
/Users/and/devel/webpack_test/src/server doesn't exist
/Users/and/devel/webpack_test/src/server.jsx doesn't exist
looking for modules in /Users/and/devel/webpack_test/node_modules
/Users/and/devel/webpack_test/node_modules/server doesn't exist (module as directory)
resolve 'file' server in /Users/and/devel/webpack_test/node_modules
resolve file
/Users/and/devel/webpack_test/node_modules/server doesn't exist
/Users/and/devel/webpack_test/node_modules/server.js doesn't exist
/Users/and/devel/webpack_test/node_modules/server.jsx doesn't exist
looking for modules in /Users/and/devel/webpack_test/bower_components
/Users/and/devel/webpack_test/bower_components/server doesn't exist (module as directory)
resolve 'file' server in /Users/and/devel/webpack_test/bower_components
resolve file
/Users/and/devel/webpack_test/bower_components/server doesn't exist
/Users/and/devel/webpack_test/bower_components/server.js doesn't exist
/Users/and/devel/webpack_test/bower_components/server.jsx doesn't exist
resolve 'bower component' server manifest files using [bower.json]
resolve file
/Users/and/devel/webpack_test/bower_components/server/bower.json doesn't exists
/Users/and/devel/webpack_test/src/server/bower.json doesn't exists
/Users/and/devel/webpack_test/node_modules/server/bower.json doesn't exists
/Users/and/devel/bower_components/server/bower.json doesn't exists
/Users/and/devel/src/server/bower.json doesn't exists
/Users/and/devel/node_modules/server/bower.json doesn't exists
/Users/and/bower_components/server/bower.json doesn't exists
/Users/and/src/server/bower.json doesn't exists
/Users/and/node_modules/server/bower.json doesn't exists
/Users/bower_components/server/bower.json doesn't exists
/Users/src/server/bower.json doesn't exists
/Users/node_modules/server/bower.json doesn't exists
/bower_components/server/bower.json doesn't exists
/src/server/bower.json doesn't exists
/node_modules/server/bower.json doesn't exists
[/Users/and/devel/webpack_test/src/server.js]
[/Users/and/devel/webpack_test/src/server]
[/Users/and/devel/webpack_test/src/server]
[/Users/and/devel/webpack_test/src/server.jsx]
[/Users/and/devel/webpack_test/node_modules/server]
[/Users/and/devel/webpack_test/node_modules/server]
[/Users/and/devel/webpack_test/node_modules/server.js]
[/Users/and/devel/webpack_test/node_modules/server.jsx]
[/Users/and/devel/webpack_test/bower_components/server]
[/Users/and/devel/webpack_test/bower_components/server]
[/Users/and/devel/webpack_test/bower_components/server.js]
[/Users/and/devel/webpack_test/bower_components/server.jsx]
@ multi main
(anonymous function) @ webpack-dev-server.js:1
n.emit @ webpack-dev-server.js:1
r.onevent @ webpack-dev-server.js:1
r.onpacket @ webpack-dev-server.js:1
t.exports @ webpack-dev-server.js:1
n.emit @ webpack-dev-server.js:1
r.ondecoded @ webpack-dev-server.js:1
t.exports @ webpack-dev-server.js:1
n.emit @ webpack-dev-server.js:1
s.add @ webpack-dev-server.js:1
r.ondata @ webpack-dev-server.js:1
t.exports @ webpack-dev-server.js:1
n.emit @ webpack-dev-server.js:1
r.onPacket @ webpack-dev-server.js:2
(anonymous function) @ webpack-dev-server.js:1
n.emit @ webpack-dev-server.js:1
r.onPacket @ webpack-dev-server.js:1
r.onData.n @ webpack-dev-server.js:1
(anonymous function) @ webpack-dev-server.js:1
e.decodePayloadAsBinary @ webpack-dev-server.js:1
e.decodePayload @ webpack-dev-server.js:1
r.onData @ webpack-dev-server.js:1
(anonymous function) @ webpack-dev-server.js:2
n.emit @ webpack-dev-server.js:1
i.onData @ webpack-dev-server.js:2
i.onLoad @ webpack-dev-server.js:2
i.create.hasXDR.n.onreadystatechange @ webpack-dev-server.js:2
index.html
<!DOCTYPE html>
<html>
<head>
<title>Basic Property Grid</title>
<!-- include react -->
<script src="./node_modules/react/dist/react-with-addons.js"></script>
</head>
<body>
<div id="content">
<!-- this is where the root react component will get rendered -->
</div>
<!-- include the webpack-dev-server script so our scripts get reloaded when we make a change -->
<!-- we'll run the webpack dev server on port 8090, so make sure it is correct -->
<script src="http://localhost:8090/webpack-dev-server.js"></script>
<!-- include the bundle that contains all our scripts, produced by webpack -->
<!-- the bundle is served by the webpack-dev-server, so serve it also from localhost:8090 -->
<script type="text/javascript" src="http://localhost:8090/assets/bundle.js"></script>
</body>
</html>
bower.json
{
"name": "Wonder",
"version": "0.0.0",
"description": "Internal app",
"main": "index.html",
"authors": [
"And"
],
"license": "MIT",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"devDependencies": {
"jquery": "~2.1.4"
}
}
Quelque part dans vos fichiers source ou vos bibliothèques tierces, il est fait référence à une ressource nommée server
(sans extension). Cela pourrait être sous la forme de require('server')
. Webpack fait de son mieux pour le localiser. Il en vérifie différentes formes (par exemple, server
sous forme de répertoire, server.js
, server.jsx
, etc.) à divers emplacements, mais il échoue à la fin. Essayez de savoir où se trouve cette référence.
Vous obtenez une erreur similaire lorsque, par erreur, utilisé npm start server
au lieu de npm run server
.
Si vous avez un script server
dans votre package.json
, exécuter npm run server
le lancera . Si vous utilisez npm start server
, il recherchera un module server
dans votre source et tentera de le démarrer.
Petite faute de frappe, mais peut facilement se produire en raison d'un manque d'attention.
J'ai eu une erreur similaire en utilisant webpack-dev-server. Bien que webpack ait été installé dans le monde entier, j'ai dû l'installer dans le cadre du projet pour résoudre la dépendance 'webpack/hot/dev-server'.
Dans ma situation, j’utilisais TFS et WebPack et j’obtenais de nombreuses erreurs module not found
.
Il s'est avéré que j'avais dans mon fichier package.json
un paquet non existant que je n'avais pas supprimé.
"primeng": "1.0.0-rc.4",
"primeng-ultima": "Unavailable"
Dès que j'ai supprimé ce paquet, tout a fonctionné.
Heureusement, les journaux m'ont conduit à cette conclusion. Ce qui s’est passé est que npm avait ignoré la restauration des autres paquets quand il n’a pas été en mesure de télécharger ce paquet.