问题描述
由于ES6模块(JavaScript模块)可用于测试:
Due the fact, that ES6-modules (JavaScript-modules) are available for testing:
- https://www.chromestatus.com/feature/5365692190687232
- https://medium.com/dev-channel/es6-modules-in-chrome-canary-m60-ba588dfb8ab7
我想知道,我应该如何缩小和准备项目发布 - 文件?早些时候,我将所有JavaScript文件捆绑到单个和缩小的文件中,除了情况,我必须通过XHR或Fetch API动态加载JS文件。
I wonder, how should I minify and prepare the project release-file? Earlier, I havde bundled all JavaScript-files into the single and minified file, except situations, where I have to load the JS-file dynamically via XHR or Fetch API.
据我了解,现在用ES6模块准备一个单一缩小的文件是不可能的,或者可能是,我只是误解了一些工作方式。
As I understand, it's rather impossible to prepare a single-minified file with the ES6-modules right now or may be, I'm just misunderstanding some ways of work.
那么,有哪些方法可以将我的ES6模块准备成单个文件,以及我应该如何准备2017年的现代JavaScript项目,其中JavaScript模块将可用?
So, are the any ways to prepare my ES6-modules into single file and how I should prepare the modern JavaScript-project in 2017 year, where JavaScript-modules will be available?
推荐答案
这是此行动的目的吗?好的,缩小的文件占用的网络流量更少,并且下载速度更快,但大多数NPM库已经提供了缩小的 dist
-files。关于捆绑在一个大文件中的主要问题。
That is purpose of this action? Okay, minified files take fewer network traffic, and will be downloaded faster, but most NPM libraries provides minified dist
-files already. And main question about bundling in one big file.
为什么webpack会这样做?对于cource,由于本机不支持浏览器中的ES模块,这就是为什么webpack以同步方式解析 import
语句和舍入依赖关系*,然后将其替换为IIFE作用域。并且执行babel翻译和polyfilling,是的。
Why webpack do it? Of cource, due absence of support for ES-modules in browser by native, What's why webpack resolves import
statements and round dependencies in synchronous manner*, and then substitute it to IIFE for scoping. And perform babel translation and polyfilling, yes.
但是随后启动了ES模块的原生支持,它变得无用了。将Web应用程序暴露给生产时的主要目标之一是使用CDN缩小服务器的流量。现在你可以用原生方式做到这一点,所以只需从 unpkg.org
导入ES模块并快乐
But then native support of ES-modules is started, it's become un-useful. One of main goals when exposing your web-app to production, is minify traffic volume for your server, using CDN. Now you can do it in native way, so just import ES-modules from unpkg.org
and be happy
*当然,如果不使用HMR,但它不适合生产模式。
*If not using HMR, of course, But it's not appropriate for production mode.
此处的实例:
这篇关于你如何建立,捆绑&缩小ES6模块?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!