如何重命名 angular yeoman index.html 文件答案

【问题标题】：How can I rename the angular yeoman index.html file如何重命名 angular yeoman index.html 文件
【发布时间】：2014-01-30 19:27:06
【问题描述】：

是否可以在 angular yeoman 生成器中重命名 index.html 文件？换句话说，我想使用不同的名称而不是 index.html

更新

更具体

我希望 yeoman 也知道更改，以便当我生成新指令、服务时，控制器 yeoman 会将其写入“构建”块。即

        <!-- build:js({.tmp,app}) scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <!-- endbuild -->

我担心如果我重命名 index.html 文件，yeoman 将不知道名称更改，因此我的新 html 文件将需要使用我的指令、控制器、服务的新脚本标记手动更新。

【问题讨论】：

标签： angularjs yeoman-generator

【解决方案1】：

是的，这是可能的。但是你必须改变你的 Gruntfile.js：

将所有出现的 index.html 更改为您的 html 文件

从以下位置更改服务器设置：

livereload: {
   options: {
     open: true,
     base: [
       '.tmp',
       '<%= yeoman.app %>'
     ]
   }
}

到：

livereload: {
    options: {
      open: 'http://localhost:9000/yourname.html',
      base: [
        '.tmp',
        '<%= yeoman.app %>'
      ]
    }
  },

如果您想使用 yeoman 角度生成器，它们不会更新与 index.html 不同的文件，因为 index.html 在生成器中是硬编码的。只有一个命令行参数 (--skip-add) 可以防止生成器接触 index.html 文件。

当然。它是开源的。相关部分在文件中：https://github.com/yeoman/generator-angular/blob/master/script-base.js

Generator.prototype.addScriptToIndex = function (script) {
  try {
    var appPath = this.env.options.appPath;
    var fullPath = path.join(appPath, 'index.html');
    angularUtils.rewriteFile({
      file: fullPath,
      needle: '<!-- endbuild -->',
      splicable: [
        '<script src="scripts/' + script.toLowerCase().replace('\\', '/') + '.js"></script>'
      ]
    });
  } catch (e) {
    console.log('\nUnable to find '.yellow + fullPath + '. Reference to '.yellow + script + '.js ' + 'not added.\n'.yellow);
  }
};

您可以更改名称 index.html 或提供其他选项来配置名称。

【讨论】：

唯一的问题是 grunt+bower 不知道将文件写入何处了。在 grunt 将文件包含到 index.html 之前，现在它不会这样做。
@EdgarMartinez 你是什么意思：“把文件写到哪里”？哪些文件？
对不起，让我说得更具体一些。我更新了这个问题，希望能澄清一下。
@EdgarMartinez 添加了如何解决此问题的提示：)
我会看看我是否可以添加该功能并提交拉取请求