AngularJS + sails.js

景德海

2023-03-14

问题内容：

我正在开发一个可以将sails.js用于后端并将AngularJS用于前端的应用程序。我以为我会使用Yeoman-
angular生成器https://github.com/yeoman/generator-
angular
创建一个Angular应用，一旦完成了前端html" target="_blank">逻辑，我就将使用创建一个Sails应用，

npm install -g帆
航行新应用

然后，我将所有AngularJS文件传输到Sails文件夹。

但是，事情是AngularJS创建了一个像https://github.com/rishy/angular-jade-stylus-
seed这样的文件夹层次结构，并在运行“
grunt服务器”时创建了一个“ dist”文件夹，其中包含最终的生产版本。

另一方面，帆应用程序的“ sails new app”文件夹层次结构类似。

api
- adapters/
- controllers/
- models/
- policies/
- services/
assets
- images/
- js /
- styles/
- favicon.ico
- robots.txt
config/
node_modules /
views
- home/
- 403.ejs
- 404.ejs
- 500.ejs
- layout.ejs
Gruntfile.js
app.js
package.JSON

所以，我的问题是：

现在，如何将我的Angular文件传输到该sails目录中，以及如何构造它？
由于sails使用“ sailslift”启动服务器，而angular使用“gruntserver”，我应该使用其中哪一个来启动我的sailsJs + AngularJs应用程序的服务器，以及在AngularJS之后创建的“ dist”文件夹呢？
我现在必须在Gruntfile.js中进行哪些更改，因为它现在应该包含来自Angular和Sails的代码了？
我应该在哪里保留不同的视图和样式文件，如何从Angular或Sails中访问这些文件？

我认为许多人都面临着类似的问题，因为AngularJS和SailsJs目前都很流行。应该有一个强大的样板来创建AngularJS +SailsJS应用程序，可惜现在没有了。

问题答案：

由于Sails是纯粹的后端框架，而Angular是纯粹的前端，因此它们可以很好地协同工作。将Angular生成器带入其中时，它可能会引起一些混乱，但是如果要从AngularSeed应用程序和Sails v0.10 开始，请遵循以下基本步骤：

使用创建一个新的Sails应用 sails new myApp
清除myApp/assets文件夹中的内容
将Angular Seed app文件夹的内容复制到myApp/assets
用myapp/views/layout.ejsAngular Seed app/index.html文件的内容替换
从layout.ejs文件中剪切掉所有非脚本标记内容（<body>标记之后和第一个<script>标记之前的所有内容，并用其替换myApp/views/homepage.ejs
放置<%-body%>在<body>标签之后layout.ejs

然后，您可以使用启动服务器，sails lift并在看到Angular应用程序http://localhost:1337。

我把它放在Github上供参考。

使用此方法，您无需对Gruntfile做任何事情，并且永远也不会调用它grunt server-仅用于使用其测试服务器测试Angular应用，而您将用Sails替换它们。您仍然可以从Sails grunt-sync任务中受益，该任务可以在前端资产发生更改时对其进行监视和同步。

如果您确实要使用Yeoman
Angular生成器，则可以尝试直接在assetsSails应用程序的文件夹中生成应用程序，并使用该文件夹中的生成器命令。我以前没有使用过它，所以我不知道dist文件夹是做什么用的，但是似乎它安装的所有节点模块都在那里支持测试Web服务器（再次不需要，因为您有Sails）和测试套件（总是很好）。我能看到的唯一问题是，您是否需要Yeoman生成的Gruntfile中的某些任务。Sails处理较少的编译和CSS最小化（在生产模式下），但是它对Jade或Stylus不起任何作用，因此，如果您确实需要这些任务，则必须将其添加到SailsGruntfile中。

AngularJS + sails.js

相关阅读

相关文章

相关问答

相关工具

相关文档