Tag: babel

不同的babel预设为后端和前端，但为相同的env

我有nodejs项目与反应前端部分，我想使用巴贝尔后端服务器（有导入/导出，和一些额外的function，如“装饰”，对象rest传播等） 此外，我想使用巴贝尔反应前端项目，但与不同的预置/插件集。 在后台我有最新的（8.2）nodejs，所以它已经知道类，asynchronous/等待等不应该被转移。 但在前端，我针对IE11，所以我必须启用大量的插件。 所以，如果我有单一的.babelrcconfiguration前端和后端我越来越transpiled后端代码。 我知道有一个'env'选项为babelconfiguration，但在描述的情况下，我有相同的'env'。 现在我结束了两个configuration：一个在package.json和一个在webpack.config（babel-loader选项）里面。 不过，我不喜欢结果，因为它可能会混淆新的开发者。 他可以在package.json里面findbabelconfiguration，并认为这是唯一的configuration，试图添加/修改某些东西，并努力为什么它不影响前端部分。 这样的设置也有一些问题： Jest无法从webpack.config中读取babel设置，所以我必须在.babelrc中定义额外的“env”：“test”，只是为了开玩笑。 这在testing过程中导致不必要的后端传输。

我怎样才能从别的地方访问项目的babel相关的代码？

这是一个奇怪的需求，但我不认为这是一个X / Y问题。 我需要从我自己的工具访问一个项目的babel相关的依赖项和configuration。 我的工具可能是devDep，或者全局安装，或者用npx运行; 我无法知道。 我知道这可以用babel-register来完成，因为像babel-tape-runner这样的优秀工具可以做到这一点。 不过，就我而言，我不能只require('babel-register') ，然后需要其他文件; 我正在使用module._compile 。 （写出临时文件，运行它，然后取消链接在这种情况下不是一个好的select，因为它可能会发生数百或数千次）。 有没有什么方法来使用用户的项目本地Babelconfiguration和预设和插件从某处读取的一些代码，在将这些东西传递给module._compile ？

Babel输出文件不存在

我尝试使用Babel来编译es5 js文件，但得到的文件不存在错误。 命令： npm run babel ./application/modules/js/seatMap/services/BabelTest.js –output-file ./application/modules/reservation_module/js/seatMap/services/babelOutput.js 命令执行后出错： ./application/modules/reservation_module/js/seatMap/services/babel.js doesn't exist 我使用–output-file param来指定输出文件，但节点告诉我文件不存在

ES6导入内部导出默认

我正在将NodeJS应用程序的整个代码从ES5迁移到ES6 / 7。 谈到import时我遇到了麻烦： 首先，我明白，导入直接调用文件。 例如 ： import moduleTest from './moduleTest'; 这段代码将进入moduleTest.js并执行它。 所以，真正的问题是关于这个代码： import mongoose from 'mongoose'; import autopopulate from 'mongoose-autopopulate'; import dp from 'mongoose-deep-populate'; import { someUtils } from '../utils'; const types = mongoose.Schema.Types; const deepPopulate = dp(mongoose); export default () => { // DOES SOMETHING USING types AND deepPopulate return someThing; }; export […]

Webpack / Babel给予意想不到的令牌错误

我有一个使用React和Webpack编写的项目，当我尝试运行我的构build时，我得到一个“意外的令牌”错误。 奇怪的是，我在我的一台机器上得到了这个错误，而另一台却没有。 背景：我有两个不同的环境。 一个是我的开发机器（Windows 10 professional）另一个是我的生成服务器（Windows 10 standard） 在这两台机器上，我已经完全卸载Node，npm等。我已经重新安装了最新版本的Node（Node 6.2.1，npm version 3.9.3）。 当我在开发环境中运行我的构build命令时，一切正常。 当我在构build环境上运行构build时，出现“意外的令牌”错误，您可能需要一个合适的加载器来处理这个文件时间。 当它试图在babel中使用jsx时，似乎发生错误。 我的webpack.prod.config.js文件如下所示： var path = require('path'); var webpack = require('webpack'); module.exports = { entry: { main: [ './dev/js/app/app', ] }, output: { filename: 'scripts.js', path: './.tmp/js/', publicPath: '/js/' }, resolve: { modulesDirectories: ['node_modules'], root: path.resolve('./dev/js/app'), extensions: ['', '.js', '.jsx'] }, module: […]

如何多次使用webpack包含babel-polyfill？

目前我有两个不同的NPM组件将被webpacked，他们都在他们的webpack入口点babel-polyfill polyfill。 现在捆绑后，我有两个不同的捆绑文件，但要求他们在同一个文件中会发生“babel-polyfill应该只需要一次”的错误。 我错过了什么，或者有没有办法解决这个问题？

在生产入口文件中使用babel-polyfill

我使用babel来转储ES7 js代码，并且所有的东西都像dev / staging中的魅力一样。 在应用程序内部，我非常依赖ES7的asynchronous/等待function。 我的入口文件如下所示： 'use strict'; require("babel-polyfill"); require("babel-core/register"); module.exports = require('./app/server').default(); 我不确定在生产环境中是否有必要保留babel-polyfill和babel-core / register模块，因为我在部署之前使用babel-cli来传输所有内容。 我认为它必须正确工作，即使我删除这些，使入口文件看起来像这样： import server from './app/server'; server(); 但是，如果这样做，我在启动应用程序时遇到了下一个exception： ReferenceError: regeneratorRuntime is not defined at C:\Users\Username\Documents\some-service\lib\app\repositories\someRepository.js:18:32 at Object.<anonymous> (C:\Users\Username\Documents\some-service\lib\app\repositories\someRepository.js:40:2) at Module._compile (module.js:460:26) at Object.Module._extensions..js (module.js:478:10) at Module.load (module.js:355:32) at Function.Module._load (module.js:310:12) at Module.require (module.js:365:17) at require (module.js:384:17) at Object.<anonymous> (C:\Users\Username\Documents\some-service\lib\app\controllers\someController.js:15:27) at […]

反应代码不与webpack编译

我的代码不会编译出于某种原因。 奇怪的是，当我在浏览器解释器中使用时会起作用。 <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script> <script src="https://unpkg.com/react@15/dist/react.js"></script> <script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script> 反应代码： var Cookies = require('cookies'); var cookieParser = require('cookie-parser'); var name = document.getElementById('name').innerHTML; //var name = req.user.name; var start = false; var Assets = React.createClass({ getInitialState: function(){ return({ assets: [], secondsElapsed: 0 }); }, tick: function() { //this.setState({secondsElapsed: this.state.secondsElapsed + 1}); if(start === true){ console.log(name); var myHeaders […]

如何从全局安装的节点应用程序中获取本地文件夹中没有node_modules的响应组件？

所以我得到了一个需要全局安装的软件包，它接受用户定义的反应组件并呈现它们。 我使用babel-register并定义： require('babel-register')({ presets: [ 'es2015', 'stage-0', 'react', ], }); 我的package.json文件如下所示： "dependencies": { "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1", "babel-preset-stage-0": "^6.24.1", "babel-register": "^6.24.1", "babel-runtime": "^6.23.0", "chokidar": "^1.7.0", "del": "^2.2.2", "marked": "^0.3.6", "react": "^15.5.4", "react-dom": "^15.5.4", "window-size": "^1.0.0", "yamljs": "^0.2.10" }, 现在，因为这些用户定义的反应组件有时住在没有安装.babelrc地方或者任何包中，所以我真的希望使用那些与包依赖关系一起全局安装的组件。 我试图避免在全球安装我的软件包时必须安装这些依赖项。 虽然不知道如何。 我检查了node_module文件夹，并安装了所有的依赖关系： . […] ├── babel-code-frame ├── babel-core ├── babel-generator ├── babel-helper-bindify-decorators ├── babel-helper-builder-binary-assignment-operator-visitor ├── […]

如何从ReactJS组件中删除“onClick”属性？

我刚开始使用ReactJS和ReactJS 。 我不太清楚一些东西。 render( ) { return ( <div> <img src={this.props.pic} onclick={this.props.cb()} class="af1" /> </div> ); } 以上是我的App组件的渲染方法。 我想在第一次点击图像后删除onClick属性，并禁用图像（ not able to click again ）10秒左右（请build议我是否有更好的方法来暂时禁用点击图像）。 这是一个很好的解决scheme吗？ 为什么不能在Chrome的开发者控制台中看到onclick attrib？ 我真的开始喜欢学这个东西，我迷路了。