Webpack構建問題與mobx和mobx反應

我有一個項目，使用React和Mobx與Mobx反應。Webpack構建問題與mobx和mobx反應

我的項目在本地運行得很好。然而，在使用webpack -p建，我得到了一個空白的屏幕，在控制檯中出現以下錯誤：

webpack:///./~/mobx-react/index.js?:3 Uncaught Error: Cannot find module "mobx" 
    at webpackMissingModule (webpack:///./~/mobx-react/index.js?:3) 
    at webpackUniversalModuleDefinition (webpack:///./~/mobx-react/index.js?:3) 
    at eval (webpack:///./~/mobx-react/index.js?:10) 
    at Object.<anonymous> (bundle.js:18) 
    at n (bundle.js:1) 
    at eval (webpack:///./src/components/Category.jsx?:35) 
    at Object.<anonymous> (bundle.js:27) 
    at n (bundle.js:1) 
    at eval (webpack:///./src/components/CategoryNavsDates.jsx?:15) 
    at Object.<anonymous> (bundle.js:14)

這裏是我的WebPack配置：

var path = require('path'); 
var webpack = require('webpack'); 
const HtmlWebpackPlugin = require('html-webpack-plugin'); 
const autoprefixer = require('autoprefixer') 
var CopyWebpackPlugin = require('copy-webpack-plugin'); 

var BUILD_DIR = path.resolve(__dirname, 'build/'); 
var SOURCE_DIR = path.resolve(__dirname, 'src/'); 

module.exports = { 
    devtool: 'eval', 
    entry: SOURCE_DIR + '/index.jsx', 
    output: { 
    path: BUILD_DIR, 
    filename: 'bundle.js' 
    }, 

    module: { 
    rules: [ 
     { 
     test: /\.(js|jsx)$/, 
     exclude: /node_modules/, 
     loader: 'babel-loader', 
     query: { 
      cacheDirectory: true, 
      plugins: ['transform-decorators-legacy'], 
      presets: ['es2015', 'stage-0', 'react'] 
     } 
     }, 
     { 
     test: /\.css$/, 
     use: [ 
      'style-loader', 
      { loader: 'css-loader', options: { modules: true, importLoaders: 1, localIdentName: "[name]__[local]___[hash:base64:3] "} }, 
      { loader: 'postcss-loader', options: {} }, 
     ] 
     }, 
    ], 
    }, 
    resolve: { 
    extensions: ['.js', '.jsx'], 
    }, 
    plugins: [ 
    new webpack.LoaderOptionsPlugin({ 
     options: { 
     postcss: function() { 
      return [ 
      require('postcss-import'), 
      require('postcss-cssnext'), 
      ]; 
     }, 
     } 
    }), 
    new CopyWebpackPlugin([{ from: 'index.html', to: '' },]) 
    ], 
    devServer: { 
    historyApiFallback: true 
    }, 
};

有一個在我的整個使用Mobx只有一個文件項目，這是錯誤引用的文件，Category.jsx。

Category.jsx樣本：

import { observer } from 'mobx-react' 
import { observable } from 'mobx' 
... 
@observer class Category extends React.Component { 
    @observable showingSmallMenu = false 
    ... 
}

正如我所說的這一切工作完全本地的罰款。

這裏有什麼問題？

來源

2017-04-10 alanbuchanan

您是否將'mobx'安裝爲'devDependencies'而不是'dependencies'？ –

如果您在mobx-react之前導入mobx，它會有所作爲嗎？

來源

2017-04-11 06:26:00 mweststrate

同樣的錯誤顯示，但這次它來自'index.js'而不是'mobx-react'： '如果（真） \t \t module.exports =工廠（__ __ webpack_require（2），__webpack_require __（（函數webpackMissingModule（）{var e = new Error（「Can not find module \」mobx \「」）; e.code ='MODULE_NOT_FOUND';; throw e;}（）））__webpack_require __（76））; （typeof define ==='function'&& define.amd） \t其他if（typeof define ==='function'&& define.amd） \t \t define（[「react」，「mobx」，「react-dom」]，factory）; ...' – alanbuchanan

index.js是什麼樣子？ – mweststrate

這裏是https://gist.github.com/alanbuchanan/dee5be42509ad74ead4f7c9702e52417 – alanbuchanan

Webpack構建問題與mobx和mobx反應

回答

相關問題