ReactJS.net - 我如何使用 ES6 模块
ReactJS.net - How do I use ES6 modules
我 ReactJS.Net 成功 运行,包括使用 ES6 语法。
我正在使用默认的 Jsx 转换管道,它使用的是 Babel。
在浏览器中查看源代码,我可以看到 ES6 代码已通过 ReactJS.Net
转换为 ES5
我一直无法让模块工作。
浏览器出现 2 个错误:
Uncaught ReferenceError: exports is not defined
Uncaught ReferenceError: require is not defined
如何使用 ES6 模块?
最简单的例子:
Lib.js
export function square(x) {
return x * x;
}
用户Lib.js
import { square } from 'Lib';
console.log(square(11));
转换为此(查看浏览器源代码):
库:
// @hash v3-AD133907ABEC5D32B3768A3AF2301FC9
// Automatically generated by ReactJS.NET. Do not edit, your changes will be overridden.
// Version: 2.0.1 (build 5e9476a)
// Generated at: 08-Nov-15 6:40:26 AM
///////////////////////////////////////////////////////////////////////////////
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.square = square;
function square(x) {
return x * x;
}
用户库:
// @hash v3-812C209AFED25C2B4507E5769B0D899B
// Automatically generated by ReactJS.NET. Do not edit, your changes will be overridden.
// Version: 2.0.1 (build 5e9476a)
// Generated at: 08-Nov-15 6:40:26 AM
///////////////////////////////////////////////////////////////////////////////
var _Lib = require('Lib');
console.log((0, _Lib.square)(11)); // 121
目前,ReactJS.Net 不处理模块。如果你想使用模块,你需要使用模块打包器,比如 Webpack 或 Browserify 来将模块编译成 vanilla JavaScript。在 ReactJS.NET 中实现对模块的支持本身就是一项非常重要的工作,因为它需要以正确的顺序处理依赖关系和加载模块,并且已经存在像 Webpack 这样经过良好测试的解决方案。
我 ReactJS.Net 成功 运行,包括使用 ES6 语法。
我正在使用默认的 Jsx 转换管道,它使用的是 Babel。 在浏览器中查看源代码,我可以看到 ES6 代码已通过 ReactJS.Net
转换为 ES5我一直无法让模块工作。
浏览器出现 2 个错误:
Uncaught ReferenceError: exports is not defined
Uncaught ReferenceError: require is not defined
如何使用 ES6 模块?
最简单的例子:
Lib.js
export function square(x) {
return x * x;
}
用户Lib.js
import { square } from 'Lib';
console.log(square(11));
转换为此(查看浏览器源代码):
库:
// @hash v3-AD133907ABEC5D32B3768A3AF2301FC9
// Automatically generated by ReactJS.NET. Do not edit, your changes will be overridden.
// Version: 2.0.1 (build 5e9476a)
// Generated at: 08-Nov-15 6:40:26 AM
///////////////////////////////////////////////////////////////////////////////
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.square = square;
function square(x) {
return x * x;
}
用户库:
// @hash v3-812C209AFED25C2B4507E5769B0D899B
// Automatically generated by ReactJS.NET. Do not edit, your changes will be overridden.
// Version: 2.0.1 (build 5e9476a)
// Generated at: 08-Nov-15 6:40:26 AM
///////////////////////////////////////////////////////////////////////////////
var _Lib = require('Lib');
console.log((0, _Lib.square)(11)); // 121
目前,ReactJS.Net 不处理模块。如果你想使用模块,你需要使用模块打包器,比如 Webpack 或 Browserify 来将模块编译成 vanilla JavaScript。在 ReactJS.NET 中实现对模块的支持本身就是一项非常重要的工作,因为它需要以正确的顺序处理依赖关系和加载模块,并且已经存在像 Webpack 这样经过良好测试的解决方案。