什么问题？

Question

已经将bundle.js编译出来了，但是刷新没效果，出现这个错误。麻烦老师解决一下

Answer 1

Parry 2017-05-20 10:21:07

运行方法

cd React-Webpack2-HMR-Template

npm install

npm start

修改 index.js 文件代码，浏览器自动刷新

• 提问者 西兰花伟大炮 #1

  老师，我是这样的，也打包成功了，但是输出就是hello,12121212!

• 提问者 西兰花伟大炮 #2

  非常感谢！

Answer 2

提问者 西兰花伟大炮 2017-05-20 22:06:28

就是这些吧？

• Parry #1

  publicPath: "/src/"

• 提问者 西兰花伟大炮 回复 Parry #2

  老师，真的可以了，实在是麻烦你了，如此有耐心，感激不已

• Parry 回复 提问者 西兰花伟大炮 #3

  没事的，因为看不到你的代码，所以解决起来比较慢。

Answer 3

提问者 西兰花伟大炮 2017-05-20 10:27:58

就是这样

• Parry #1

  你多截点图，包括命令行和代码的。

Answer 4

提问者 西兰花伟大炮 2017-05-20 10:25:05

这里显示成功，但是浏览器一直打印hello,12121212!,我改了h1里面的内容也没变化

Answer 5

提问者 西兰花伟大炮 2017-05-20 10:19:50

老师，使用webpack-dev-server又有这个错误

• Parry #1

  运行方法
  
  cd React-Webpack2-HMR-Template
  npm install
  npm start
  修改 index.js 文件代码，浏览器自动刷新

Answer 6

Parry 2017-05-20 10:08:32

启动 webpack-dev-server 了吗？

• 提问者 西兰花伟大炮 #1

  我输的是webpack

Answer 7

提问者 西兰花伟大炮 2017-05-19 20:15:31

var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');

module.exports = {
  context: path.join(__dirname),
  devtool: debug ? "inline-sourcemap" : null,
  entry: "./src/js/index.js",
  module: {
    loaders: [
      {
        test: /\.js?$/,
        exclude: /(node_modules)/,
        loader: 'babel-loader',
        query: {
          presets: ['react', 'es2015'],
          plugins: ['react-html-attrs'], //添加组件的插件配置
        }
      },
      //下面是使用 ant-design 的配置文件
      { test: /\.css$/, loader: 'style-loader!css-loader' }
    ]
  },
  output: {
    path: __dirname,
    filename: "./src/bundle.js"
  },
  plugins: debug ? [] : [
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
  ],
};

{
  "name": "react_form_new_to_old",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.24.1",
    "babel-preset-env": "^1.4.0",
    "source-map": "^0.5.6"
  },
  "dependencies": {
    "babel-loader": "^7.0.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babelify": "^7.3.0",
    "react": "^15.5.4",
    "react-dom": "^15.5.4",
    "webpack": "^2.5.1",
    "webpack-dev-server": "^2.4.5"
  }
}

老师，确实还是不行

• Parry #1

  安装了 sourcemap 后是什么错误？还有请使用系统自带的命令行以管理员运行的模式输入命令。

• Parry #2

  这里还有一个我建立的空的配置模版 https://github.com/ParryQiu/React-Webpack2-HMR-Template
  你可以直接下载了测试，我测试多变，都是可以使用的。

• 提问者 西兰花伟大炮 回复 Parry #3

  真是太谢谢老师了

点开查看后面2条评论

Answer 8

提问者 西兰花伟大炮 2017-05-19 20:01:54

；老师，我输入webpack为什么报错啊？刚才的插件装好了

• Parry #1

  你的 webpack 配置文件是不是自己写的？
  npm install source-map --save-dev
  安装下缺失的组件，认真看错误啊。
  安装了还是不行你就把你的配置文件贴一下我好帮你找到错误。

• 提问者 西兰花伟大炮 回复 Parry #2

  老师，配置文件我是直接复制你视频旁边提供的

Answer 9

weibo_暗黑3215_0 2017-05-19 19:49:50

看你安装react-html-attrs报错，你淘宝镜像弄了吗

• 提问者 西兰花伟大炮 #1

  用cnpm？

Answer 10

提问者 西兰花伟大炮 2017-05-19 19:43:48

安装显示这个

• Parry #1

  npm install babel-plugin-react-html-attrs

• Parry #2

  我发给你的文章里有详细的安装命令，你也不看哎。

Answer 11

提问者 西兰花伟大炮 2017-05-19 19:40:37

老师，我装了的，但是还是这样

Answer 12

Parry 2017-05-19 19:34:37

同学你好，你安装一下确实的组件，错误已经提醒了你。

npm install react-html-attrs