码迷,mamicode.com
首页 > Web开发 > 详细

webpsck配置react环境

时间:2018-04-06 15:19:44      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:webpsck配置react环境

  • webpack插件:
    npm  install  babel-core  babel-loader  babel-preset-react  babel-preset-es2015
  • sublime插件:
    jsx  // 高亮jsx语法
  • 修改webpack配置文件:
    技术分享图片
    const path = require(‘path‘);
    module.exports = {
    entry: ‘./src/index.js‘,
    devtool: ‘inline-source-map‘,
    devServer: {
      contentBase: ‘./dist‘
    },
    output: {
      filename: ‘bundle.js‘,
      path: path.resolve(__dirname, ‘dist‘)
    },
    module: {
      rules: [
        {
          test: /\.jsx?$/,
          exclude: /node_modules/,
          loader: ‘babel-loader‘,
          query: {
            presets: [‘es2015‘, ‘react‘]
          }
        }
      ]
    }
    };
  • 测试:
    技术分享图片
    技术分享图片
    技术分享图片
  • webpsck配置react环境

    标签:webpsck配置react环境

    原文地址:http://blog.51cto.com/12173069/2095204

    (0)
    (0)
       
    举报
    评论 一句话评论(0
    登录后才能评论!
    © 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
    迷上了代码!