阵营本地捆绑失败，因为“无法找到预设的‘阶段1’”

Question

我得到一个反应，本机应用程序出现以下错误：

error: bundling failed: "TransformError: /Users/codeaway/repos/webGL/node_modules/react-native-webgl/lib/index.js: Couldn't find preset \"stage-1\" relative to directory \"/Users/codeaway/repos/webGL/node_modules/react-native-webgl\""

我建立一个反应，本机应用程序，我需要实现上的照片过滤器，所以我想用下面的NPM包（从我的package.json）：

"gl-react": "^3.13.0" 
"gl-react-native": "^3.13.0" 
"react-native-webgl": "^0.5.2" 

的代码是非常简单的;我真的只是想从包中的文档运行示例：

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 
import { Surface } from "gl-react-native"; 
import { Shaders, Node, GLSL } from "gl-react"; 

const shaders = Shaders.create({ 
    helloGL: { 
// This is our first fragment shader in GLSL language (OpenGL Shading Language) 
// (GLSL code gets compiled and run on the GPU) 
    frag: GLSL` 
precision highp float; 
varying vec2 uv; 
void main() { 
    gl_FragColor = vec4(uv.x, uv.y, 0.5, 1.0); 
} 
` 
// the main() function is called FOR EACH PIXELS 
// the varying uv is a vec2 where x and y respectively varying from 0.0 to 1.0. 
// we set in output the pixel color using the vec4(r,g,b,a) format. 
// see GLSL_ES_Specification_1.0.17 
    } 
}); 

export default class webGL extends Component { 
    render() { 
    return (
     <View> 
     <Surface width={200} height={200}> 
     <Node shader={shaders.helloGL} /> 
     </Surface> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
    instructions: { 
    textAlign: 'center', 
    color: '#333333', 
    marginBottom: 5, 
    }, 
}); 

AppRegistry.registerComponent('webGL',() => webGL); 

这是在错误中提到的目录中.bablerc（“/用户/ codeaway /回购/ WEBGL/node_modules /反应母语-webgl \“）：

{ 
    "presets": ["es2015", "stage-1", "react"] 
} 

这是怎么回事？

Answer 1

你需要以下软件包添加到您的的package.json文件

"babel-core": "^6.24.1" 
"babel-preset-stage-1": "^6.24.1" 

而且随着npm install

看来，无论你正在使用你的项目捆绑之后安装它们（可能Webpack），使用阶段1预设的babel。