本地webpack-dev-server –inline –hot项目可以正常运行起来，webpack命令之后本地打开项目一片空白，部署也是空白

Question

使用的老师github上的源代码react-router-4_webpack-2做部署练习，本地webpack-dev-server –inline –hot项目可以正常运行起来，ctrl+c结束后执行webpack命令之后本地打开项目一片空白，将项目部署到tomcat后访问http://localhost:8080/react-router-4_webpack-2/还是看到一片空白，打开控制台也没有任何报错，老师我部署时是将整个react-router-4_webpack-2项目文件夹完整拷贝到webapps下面的，这样对不对？还需要留node_modules文件夹和组件源代码文件吗？没有做过react项目部署真的很疑惑

Answer 1

Parry 2018-03-24 10:10:08

./src 这样是在服务器里不行的

你修改成 src/ 测试下看看，感觉就是 js 没有加载上，不过加载不到应该有 404 的。

• 提问者 qq_小江南_04298178 #1

  非常感谢！

• 提问者 qq_小江南_04298178 #2

  老师之前是src/报404错了，我后来修改成.src/确实没有任何报错，页面空白，切换成手机模式页面可以出来不过也有报错，手机端的这个报错在webpack-dev-server运行时也有，我等下把项目发到您邮箱。

Answer 2

Parry 2018-03-26 16:42:30

看我的 github 更新，有视频教程。

=====================================================

此慕课网 React 课程学习遇到的常见问题以及没有审核通过的补充视频（如打包后的文件压缩、单独的 webpack 2 视频教程等）

我整理成了一个大的 QA 文档，可以直接参考我博客的整理。

基本包含了所有 React 初学时遇到的各种问题的解决方案。

我的博文地址：http://blog.parryqiu.com/2017/03/09/react-q-and-a/

项目源码在线地址：https://github.com/ParryQiu/IMOOC-React

GitHub 更新了：

针对源码文件夹 react-router-4_webpack-2-update 更新的讲解视频

主要讲解了如下几个问题

1: 如果初始化下载的源码；

2: 如何在本地运行项目；

3: 如何修改代码，可以直接打开 html 就可以运行，这样你就可以将 React 的项目直接当成一个静态站点进行部署。

 

目前文章主要包含了以下问题的解决方案：

一些课程资源，如源代码、思维导图、后台 API 源代码等；

关于 Webpack      2.0 详细使用的 20 集免费补充视频；

webpack-dev-server      不能自动刷新的问题；

使用 Webpack      2 搭建的 React 浏览器自动刷新的项目模板，多次测试可用；

React      Developer Tool 的问题；

缺少      react-html-attrs 插件；

babel-loader      没加载的错误；

fetch 的使用；

占用端口 8080 的问题；

错误 The      root route must render a single element 的处理；

如何在chrome      console 中打开 paint flashing；

父组件通过 refs 获取子组件真实 DOM 节点的问题；

跳转 Route 的问题；

将      AntDesign 中的 getFieldProps 替换成      getFieldDecorator 的处理；

错误 Target      container is not a DOM element 的原因及解决方案；

慕课没有发布的更新课程；

React      Router 4.0 中 location undefined 的问题；

AntDesign      官方文档中的函数语法错误的解决方案；

解决课程中 React      Router 版本的差异问题；

课程中 API 的地址。

Answer 3

Parry 2018-03-24 10:10:50

不行你把项目文件打包发我邮箱 [e-mail]

Answer 4

Parry 2018-03-24 10:10:29

控制台没有任何错误吗？

Answer 5

Parry 2018-03-23 15:36:34

 不需要保留的，只需要打包后的 js 文件，可以贴一下 html 中的 js 引用吗？以及打包后的文件列表。

• 提问者 qq_小江南_04298178 #1

  谢谢老师回复，html中js的引用如下：
      <link rel="stylesheet" href="./src/css/pc.css">
      <link rel="stylesheet" href="./src/css/mobile.css">
      <script src="./src/bundle.js"></script>
  打包后的文件列表如下：

• 提问者 qq_小江南_04298178 #2

  Hash: af37172bb046d83e3de5
  Version: webpack 2.7.0
  Time: 11167ms
            Asset     Size  Chunks                    Chunk Names
  ./src/bundle.js  13.9 MB       0  [emitted]  [big]  main
     [0] ./~/_react@15.6.2@react/react.js 56 bytes {0} [built]
    [12] ./~/_react-dom@15.6.2@react-dom/index.js 59 bytes {0} [built]
    [75] ./~/_antd@2.13.13@antd/lib/button/index.js 503 bytes {0} [built]
    [98] ./~/_antd@2.13.13@antd/lib/card/index.js 9.92 kB {0} [built]
    [99] ./~/_antd@2.13.13@antd/lib/form/index.js 333 bytes {0} [built]
   [100] ./~/_antd@2.13.13@antd/lib/menu/index.js 9.21 kB {0} [built]
   [119] ./~/_react-router-dom@4.2.2@react-router-dom/es/index.js 925 bytes {0} [built]

• 提问者 qq_小江南_04298178 #3

  [567] ./~/_react-responsive@1.3.4@react-responsive/dist/react-responsive.js 57.2 kB {0} [built]
   [568] ./~/_antd@2.13.13@antd/dist/antd.css 934 bytes {0} [built]
   [712] ./src/js/root.js 4.79 kB {0} [built]
   [770] ./~/_css-loader@0.25.0@css-loader!./~/_antd@2.13.13@antd/dist/antd.css 504 kB {0} [built]
  [1193] ./~/_react-router-dom@4.2.2@react-router-dom/es/NavLink.js 2.66 kB {0} [built]
  [1194] ./~/_react-router-dom@4.2.2@react-router-dom/es/Prompt.js 131 bytes {0} [built]
  [1195] ./~/_react-router-dom@4.2.2@react-router-dom/es/Redirect.js 137 bytes {0} [built]
  [1196] ./~/_react-router-dom@4.2.2@react-router-dom/es/StaticRouter.js 149 bytes {0} [built]
  就在刚刚无意间发现部署的项目模拟器下移动端可以出来画面，虽然Mobilelist组件有报错，但是他的报错内容和用webpack-dev-server --inline --hot 运行起来移动端的报错一样的

点开查看后面1条评论