4

我正在尝试在我的项目中使用 yeoman，但在尝试使用 Grunt 构建它时遇到了问题：

我有一个 application.js，它是应用程序使用的主文件，使用 require.js。运行 Grunt build 后，会在 dist 文件夹中创建 js 文件，并将其连接并缩小。

问题是当我尝试创建第二个 javascript 文件（例如 application2.js）以在应用程序的另一个页面中使用时。运行 Grunt 后，文件已创建但为空。我尝试使用与排除某些 js 或 require.js 问题的 js 相同的 js，但结果相同。

我唯一能想到的是，Grunt 中的某处被配置为仅处理该文件，实际上在运行时我可以在控制台中看到以下内容：

Found a block:
    <!-- build:js scripts/application.js -->
    <script data-main="scripts/application" src="components/requirejs/require.js"></script>
    <!-- endbuild -->
Updating config with the following assets:
    - dist/scripts/application.js

Found a block:
    <!-- build:js scripts/application2.js -->
    <script data-main="scripts/application2" src="components/requirejs/require.js"></script>
    <!-- endbuild -->
Updating config with the following assets:
    - dist/scripts/application2.js

Configuration is now:

  cssmin:
  { dist: {} }

  concat:
  { 'dist/scripts/application.js': [ 'dist/scripts/application.js' ],
  'dist/scripts/vendor/modernizr.js': [ 'app/components/modernizr/modernizr.js' ],
  'dist/scripts/application2.js': [ 'dist/scripts/application2.js' ] }

  uglify:
  { 'dist/scripts/application.js': 'dist/scripts/application.js',
  'dist/components/requirejs/require.js': 'app/components/requirejs/require.js',
  'dist/scripts/vendor/modernizr.js': 'dist/scripts/vendor/modernizr.js',
  'dist/scripts/application2.js': 'dist/scripts/application2.js' }

  requirejs:
  { dist:
   { options:
      { baseUrl: 'app/scripts',
        optimize: 'none',
        preserveLicenseComments: false,
        useStrict: true,
        wrap: true,
        uglify2: {},
        name: 'application',
        out: 'dist/scripts/application.js',
        mainConfigFile: 'app/scripts/application.js' } } }

Running "requirejs:dist" (requirejs) task
>> RequireJS optimizer finished
Uncompressed size: 1361156 bytes.
Compressed size: 304370 bytes gzipped.

Concat 和 Uglify 任务引用第二个 javascript 文件，但需要 js。我尝试更改属性“mainConfigFile”，以包括两者，但它不断被覆盖......

有任何想法吗？？

4

1 回答 1

5

我首先很好奇您为什么要在 yeoman 系统中定义多个应用程序文件？这是针对多个 HTML 页面的，我猜？或者你有两个：

<script data-main="..." src="components/requirejs/require.js"></script>

在单个 HTML 文件中？

至于对此的修复： mainConfigFile 是使用 'out' 参数生成的，因此在这里设置它不起作用。

您的 requirejs 部分需要每个文件的“dist”部分。他们还需要手动指定名称和输出。不确定这是错误还是预期行为。

requirejs: {
   dist1: {
      options: {
         name: 'application', out: 'dist/scripts/application.js',
         ...}
   },
   dist2: {
      options: {
         name: 'application2', out: 'dist/scripts/application2.js',
         ...

您还需要将两个单独的 HTML 文件添加到 useminPrepare，但看起来您已经这样做了，或者您正在一个 HTML 文件中引用 application 和 application2（不确定一个 html 文件中的两个 requirejs 配置的后果是什么） .

    useminPrepare: {
        html: ['<%= yeoman.app %>/index.html','<%= yeoman.app %>/index2.html'],
        options: {
            dest: '<%= yeoman.dist %>'
        }
    },

为了后代，我还将这两个脚本添加到 bower 配置中，但我不能 100% 确定它是否重要：

    bower: {
        all: {
            rjsConfig: ['<%= yeoman.app %>/scripts/application.js','<%= yeoman.app %>/scripts/application2.js']
        }
    }

这是我生成的配置输出： http: //pastie.org/7321492

于 2013-04-05T00:02:04.873 回答