相关疑难解决方法(0)

我有这个代码:

"use strict";

import browserSync from "browser-sync";
import httpProxy from "http-proxy";

let proxy = httpProxy.createProxyServer({});

我通过npm 安装babel-core并babel-cli全局安装.关键是当我尝试在终端上使用它编译时:

babel proxy.js --out-file proxified.js

输出文件被复制而不是编译(我的意思是,它与源文件相同).

我在这里错过了什么？

我刚刚开始使用Reactjs并且正在编写一个简单的组件来显示
li标签并遇到了这个错误:

意外的标记'<'

我把例子放在jsbin下面 http://jsbin.com/UWOquRA/1/edit?html,js,console,output

请让我知道我做错了什么.

webpack.config.js

module.exports = {
  context: __dirname + "/app",
  entry: {
    javascript: "./app.js",
    html: "./index.html",
  },
  resolve: {
   extensions: ['', '.js', '.jsx']
 },
  output: {
    filename: "app.js",
    path: __dirname + "/dist",
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: "babel-loader",
      },
      {
        test: /\.html$/,
        loader: "file?name=[name].[ext]",
      },
    ],
  },
}

的package.json

{
  "name": "react-webpack-project",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": { …

我是Webpack的新手并且在本教程之后遇到了问题.

看来webpack.config.js没有设置babel-loader正确,但我不sure.In我看到下面的错误控制台:

bundle.js:49 Uncaught SyntaxError: Unexpected token import

哪个指的import sortBy from 'lodash/collection/sortBy';是我的行index.js.所以我认为这是一个babel转换问题(不允许importES6 的语法？)

这是完整的index.js文件

import sortBy from 'lodash/collection/sortBy';
import {users} from './users';
import {User} from './User';

sortBy(users, 'name')
    .map(user => {
        return new User(user.name, user.age);
    })
    .forEach(user => {
        console.log(user.display);
    });

而且webpack.config.js看起来是这样的:

module.exports = {
    entry: './src/index.js',
    output: {
        path: './public/',        
        filename: 'bundle.js'
    },
    devServer: {
        contentBase: './public/'
    },
    module: {
        loaders: [
            {test: /\.js$/, exclude: …

环境宝石：Rails 5.2.1 Webpacker 3.5.5

这是我的 package.json

{
  "private": true,
  "scripts": {
    "test": "jest",
    "build": "./bin/webpack"
  },
  "devDependencies": {
    "autoprefixer": "9.1.1",
    "jest": "23.4.1",
    "webpack-cli": "3.1.0",
    "webpack-dev-server": "2.11.2",
    "babel-core": "~6.26.3",
    "babel-loader": "^7.0.2",
    "babel-preset-react": "~6.24.1",
    "postcss-loader": "~3.0.0",
    "sass-loader": "~7.1.0",
    "webpack": "^3.5.5"
  },
  "jest": {
    "roots": [
      "app/specs/"
    ]
  },
  "dependencies": {
    "@rails/webpacker": "3.5",
    "prop-types": "~15.6.2",
    "react": "~16.5.2",
    "react-dom": "~16.5.2"
  }
}

webpacker.yml.jsx在该extensions部分中接受。

这是我的 .babelrc

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": "> 1%",
          "uglify": true …

我是新来的世界反应,我有一个不会让我进步的错误.这是我的webpack

module.exports = {
entry: [
'./src/index.js'
],
output: {
path: __dirname,
publicPath: '/',
filename: 'bundle.js'
},
module: {
 loaders: [{
  exclude: /node_modules/,
  loader: 'babel'
 }]
}
resolve: {
 extensions: ['', '.js', '.jsx']
},
devServer: {
 historyApiFallback: true,
 contentBase: './'
}
};

这是我的代码js

import React from 'react';
import ReactDOM from 'react-dom';

import SearchBar from './components/search_bar';

const API = '';

const App = () => {
 return (
     <div>
         <SearchBar />
     </div>
 );
}

ReactDOM.render(<App />, document.querySelector('.container'));

这是错误 https://gyazo.com/be83135be6f0e7b8ca0c2852536c792f

我试过这个解决方案,但它不起作用 babel-loader …

我正在尝试构建我的应用程序wepback并遇到此unexpected token错误.我的项目的所有依赖项都很好,并且最新我在其他地方使用相同的项目并且它正在构建正常但是当我尝试构建我的当前代码时,它给出了错误,下面是config.js和错误描述

这是我的app.jsx

import React                from 'react';
import ReactDOM             from 'react-dom';
import {Router}             from 'react-router';
import Routes               from '../routes/routes';
import injectTapEventPlugin from 'react-tap-event-plugin';
import { browserHistory }   from 'react-router';

require('../Config');

injectTapEventPlugin();

window.EventEmitter = {
    _events: {},
    dispatch: function (event, data, returnFirstResult) {
        if (!this._events[event]) return;
        for (var i = 0; i < this._events[event].length; i++)
        {
            if(this._events[event][i])
            {
                var r = this._events[event][i](data);

                if(returnFirstResult)   
                    return r;
            }
        }
    },
    subscribe: function (event, callback, onlyOne) {
        if (!this._events[event] || …