1
webpackでビルドを実行しようとしてエラーが発生しました。 webpackのような反応、反応domと反応ルータを解決することはできません。私は設定ファイル、エラー、私のpackage.jsonを含めています。私はどこが間違っているのか分かりません。エラーリアクション、リアックドーム、リアクションルータで@マルチエラーに直面
var webpack = require('webpack');
var path = require('path');
function _path(p) {
return path.join(__dirname, p);
}
module.exports = {
entry: [
'./app/app.jsx'
],
externals: {
jquery: 'jQuery'
},
plugins: [
new webpack.ProvidePlugin({
'$': 'jquery',
'jQuery': 'jquery'
}),
new webpack.LoaderOptionsPlugin({
options: {
sassLoader: {
includePaths: [
path.resolve(__dirname, './node_modules/foundation-sites/scss')
]
}
}
})
],
output: {
path: __dirname,
filename: './public/bundle.js'
},
resolve: {
modules: [__dirname],
alias: {
'jquery': _path('node_modules/jquery/dist/jquery'),
'foundation': _path('node_modules/foundation-sites/dist/js/foundation'),
Main: 'app/components/main.jsx',
Nav: 'app/components/nav.jsx',
Timer: 'app/components/timer.jsx',
Countdown: 'app/components/countdown.jsx',
Clock: 'app/components/clock.jsx',
CountdownForm: 'app/components/countdownForm.jsx',
Controls: 'app/components/controls.jsx',
applicationStyles: 'app/styles/app.scss'
},
extensions: ['*', '.js', '.jsx']
},
module: {
loaders: [
{
loader: 'babel-loader',
query: {
presets: ['react', 'es2015', 'stage-0']
},
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/
}
]
},
devtool: 'eval-source-map'
}
そして、ここにある：
は、ここに私のwebpack.config.js構成だ
ERROR in ./app/app.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app'
@ ./app/app.jsx 3:13-29
@ multi ./app/app.jsx
ERROR in ./app/app.jsx
Module not found: Error: Can't resolve 'react-dom' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app'
@ ./app/app.jsx 9:15-35
@ multi ./app/app.jsx
ERROR in ./app/app.jsx
Module not found: Error: Can't resolve 'react-router' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app'
@ ./app/app.jsx 11:15-38
@ multi ./app/app.jsx
ERROR in ./app/components/main.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/main.jsx 3:12-28
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/components/timer.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/timer.jsx 3:12-28
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/components/countdown.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/countdown.jsx 3:12-28
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/app.jsx
Module not found: Error: Can't resolve 'style' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
You need to specify 'style-loader' instead of 'style',
see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed
@ ./app/app.jsx 25:0-43
@ multi ./app/app.jsx
ERROR in ./app/components/nav.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/nav.jsx 3:12-28
@ ./app/components/main.jsx
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/components/nav.jsx
Module not found: Error: Can't resolve 'react-router' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/nav.jsx 5:15-38
@ ./app/components/main.jsx
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/components/clock.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/clock.jsx 3:12-28
@ ./app/components/timer.jsx
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/components/controls.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/controls.jsx 3:12-28
@ ./app/components/timer.jsx
@ ./app/app.jsx
@ multi ./app/app.jsx
ERROR in ./app/components/countdownForm.jsx
Module not found: Error: Can't resolve 'react' in '/home/kollie/Desktop/DevFolders/React/ReactTimer/app/components'
@ ./app/components/countdownForm.jsx 3:12-28
@ ./app/components/countdown.jsx
@ ./app/app.jsx
@ multi ./app/app.jsx
マイpackage.json：へ
"dependencies": {
"axios": "^0.15.2",
"express": "^4.14.0",
"react": "^15.4.2",
"react-addons-test-utils": "^15.4.2",
"react-dom": "^15.4.2",
"react-router": "^3.0.3"
},
"devDependencies": {
"babel-core": "^6.18.2",
"babel-loader": "^6.2.7",
"babel-preset-es2015": "^6.18.0",
"babel-preset-react": "^6.16.0",
"babel-preset-stage-0": "^6.16.0",
"css-loader": "^0.26.0",
"expect": "^1.20.2",
"foundation-sites": "^6.2.4",
"jquery": "^3.1.1",
"karma": "^1.4.1",
"karma-chrome-launcher": "^2.0.0",
"karma-mocha": "^1.3.0",
"karma-mocha-reporter": "^2.2.2",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "^2.0.2",
"mocha": "^3.2.0",
"node-sass": "^4.5.2",
"sass-loader": "^6.0.3",
"script-loader": "^0.7.0",
"style-loader": "^0.13.1",
"webpack": "^2.3.2"
}
これはそれらのすべてのエラーを遠くに運びます。しかし、あなたがそれを見る時間があれば、私は別のものに遭遇しています。 ./~/css-loader/./~/sass-loader/lib/loader.js!./~/style-loader!/app/styles/app.scssのエラー モジュールビルドに失敗しました： @import "ベース/変数 "; ^ –
SCSSには相対パスの特殊な構文がないので、実際は '@import" ./base/variables "と同じです。 Webpackでは、 '〜'を追加することで通常のモジュールとして解決できます。ですから、 '@import"〜base/variables "'に変更する必要があります。 ['' sass-loader's imports]（https://github.com/webpack-contrib/sass-loader#imports）に記載されています。 –