轻松部署 Angular2 应用程序,我需要学习 SystemJS 和 Gulp 吗?
Easy deploy of Angular2 app, do I need to learn SystemJS and Gulp?
我用 Angular2 编写了一个应用程序。在本地使用 lite-server,该应用程序可以完美运行。现在我有了一个虚拟主机,我可以通过 ftp 传输文件。我天真地尝试将所有文件传输到服务器,并更正了一些绝对路径,使我的应用程序可以在服务器上访问。
这行不通。您实际上可以看到它在这里不起作用
mypage。然后,我开始在网上阅读有关此内容的信息,但发现并没有像我希望的那样多。我发现有人说你应该只上传所有的 js 文件,一切都应该正常,这对我不起作用,但也许我犯了一些愚蠢的错误。
其他人使用 Gulp、Webpack、SystemJs 解释流程...
但是当他们这样做时,他们会以我不明白的方式解释它,因为我对这些事情一无所知。
在我看来,这些进程还关心使应用程序更小、更高效,我根本不在乎,也许将来我会,但现在我只希望它像在本地一样工作。
所以我真正想知道的是,尽管制作一个在本地运行的应用程序非常容易,但如此难以部署是正常的吗?服务器?我是否需要遵循有关 Gulp、SystemJs 等的教程?是不是因为 Angular2 现在还没有正式上线?
如果答案是肯定的,我首先需要哪一个,我该如何开始学习这些东西?
我在这个网站上发现了几个问题,其中最相关的是
How to deploy Angular 2 application developed in Typescript to production?
但没有任何答案对我有帮助。
我也尝试了 中的第一个答案,但我完全不了解 SystemJs 和 Gulp 妨碍了我。
在另一个问题中,我找到了这个工作示例 example on Github
但是我没有机会将我的项目与这个项目进行比较,我不明白示例中应该是什么以及我应该在我的项目中保持什么方式,我所有的尝试都以我的应用程序不再在本地运行而告终或者没有改善。
在您的 index.html
中有这些行:
<script src="sse/test/bundle.js"></script>
<script>
System.import('sse/test/bundle.js')
.then(null, console.error.bind(console));
</script>
您基本上是在加载同一个文件两次。 bundle.js
被打包为系统包,您正在使用第一个脚本标签正确加载它。加载后,它可供 SystemJS
使用,您只需从那里调用主模块。
因此,将导入脚本更改为:
<script>
System.import('main')
.then(null, console.error.bind(console));
</script>
应用程序应该可以运行...
你试过了吗https://github.com/angular/angular-cli?
相当容易使用,但我建议你学习how JS module works。 SystemJS 和 Webpack 只是加载器和捆绑器的选择,Gulp 只是一个构建系统,很不错,但根本不是必需的。
我用 Angular2 编写了一个应用程序。在本地使用 lite-server,该应用程序可以完美运行。现在我有了一个虚拟主机,我可以通过 ftp 传输文件。我天真地尝试将所有文件传输到服务器,并更正了一些绝对路径,使我的应用程序可以在服务器上访问。
这行不通。您实际上可以看到它在这里不起作用 mypage。然后,我开始在网上阅读有关此内容的信息,但发现并没有像我希望的那样多。我发现有人说你应该只上传所有的 js 文件,一切都应该正常,这对我不起作用,但也许我犯了一些愚蠢的错误。
其他人使用 Gulp、Webpack、SystemJs 解释流程... 但是当他们这样做时,他们会以我不明白的方式解释它,因为我对这些事情一无所知。 在我看来,这些进程还关心使应用程序更小、更高效,我根本不在乎,也许将来我会,但现在我只希望它像在本地一样工作。
所以我真正想知道的是,尽管制作一个在本地运行的应用程序非常容易,但如此难以部署是正常的吗?服务器?我是否需要遵循有关 Gulp、SystemJs 等的教程?是不是因为 Angular2 现在还没有正式上线?
如果答案是肯定的,我首先需要哪一个,我该如何开始学习这些东西?
我在这个网站上发现了几个问题,其中最相关的是 How to deploy Angular 2 application developed in Typescript to production? 但没有任何答案对我有帮助。
我也尝试了
在另一个问题中,我找到了这个工作示例 example on Github 但是我没有机会将我的项目与这个项目进行比较,我不明白示例中应该是什么以及我应该在我的项目中保持什么方式,我所有的尝试都以我的应用程序不再在本地运行而告终或者没有改善。
在您的 index.html
中有这些行:
<script src="sse/test/bundle.js"></script>
<script>
System.import('sse/test/bundle.js')
.then(null, console.error.bind(console));
</script>
您基本上是在加载同一个文件两次。 bundle.js
被打包为系统包,您正在使用第一个脚本标签正确加载它。加载后,它可供 SystemJS
使用,您只需从那里调用主模块。
因此,将导入脚本更改为:
<script>
System.import('main')
.then(null, console.error.bind(console));
</script>
应用程序应该可以运行...
你试过了吗https://github.com/angular/angular-cli? 相当容易使用,但我建议你学习how JS module works。 SystemJS 和 Webpack 只是加载器和捆绑器的选择,Gulp 只是一个构建系统,很不错,但根本不是必需的。