我有以下package.json文件:

{
  "name": "dongio",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "build:less": "less ./app/modules/*/*.less > ./public/stylesheets/style.css",
    "build:js": "browserify -t babelify app/routes/*.js > public/javascripts/bundle.js",
    "start": "npm run build:less | npm run build:js | node server.js"
  },
  "dependencies": {
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.1.18",
    "babelify": "^7.2.0",
    "body-parser": "~1.13.2",
    "browserify": "^12.0.1",
    "cookie-parser": "~1.3.5",
    "debug": "~2.2.0",
    "express": "^4.13.3",
    "express-handlebars": "^2.0.1",
    "flux": "^2.1.1",
    "history": "^1.13.1",
    "less-middleware": "1.0.x",
    "morgan": "^1.6.1",
    "react-router": "^1.0.0",
    "serve-favicon": "^2.3.0",
    "vinyl-source-stream": "^1.1.0"
  },
  "devDependencies": {
    "babelify": "^7.2.0"
  },
  "browserify": {
    "transform": [
      [
        "babelify",
        {
          "presets": [
            "es2015",
            "react"
          ]
        }
      ]
    ]
  }
}


我不知道为什么,但是babelify根本不起作用?我收到以下错误:

layout.js: Unexpected token (11:22)
   9 |
  10 |     render() {
> 11 |         let navbar = (<nav>
     |                       ^
  12 |                     <div>
  13 |                         <ul>
  14 |                             <li><Link to='login'>Login</Link></li>


知道为什么会这样吗?我还把它放在devDependency下,在全局范围内安装了它,没有帮助。

最佳答案

好了,终于通过更改build:js命令解决了我的问题。我不知道为什么browserify中的package.json转换设置不起作用。我必须在命令中显式预设浏览器,如下所示:

{
  "name": "dongio",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "build:less": "less ./app/modules/*/*.less > ./public/stylesheets/style.css",
    "build:js": "browserify -t [ babelify --presets [ es2015 react ] ] app/routes/*.js* > public/javascripts/bundle.js",
    "start": "npm run build:js | node server.js"
  },
  "dependencies": {
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.1.18",
    "body-parser": "~1.13.2",
    "browserify": "^12.0.1",
    "cookie-parser": "~1.3.5",
    "debug": "~2.2.0",
    "express": "^4.13.3",
    "express-handlebars": "^2.0.1",
    "flux": "^2.1.1",
    "history": "^1.13.1",
    "less-middleware": "1.0.x",
    "morgan": "^1.6.1",
    "react": "^0.14.3",
    "react-router": "^1.0.0",
    "serve-favicon": "^2.3.0",
    "vinyl-source-stream": "^1.1.0"
  },
  "devDependencies": {
    "babelify": "^7.2.0"
  }
}


请注意,您必须npm install babel-preset-es2015babel-preset-react才能完成此工作。

关于javascript - babelify无效,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33824866/

10-12 15:25