Grunt 服务器没有为我的应用程序使用虚拟主机名。vhost 和 httpd 已设置,但 grunt 没有使用它们

Posted

技术标签:

【中文标题】Grunt 服务器没有为我的应用程序使用虚拟主机名。vhost 和 httpd 已设置,但 grunt 没有使用它们【英文标题】:Grunt server does not use virtual host name for my app..vhost and httpd are set up but grunt is not using them 【发布时间】:2013-11-22 01:55:59 【问题描述】:

所以我尝试使用名称而不是使用 127 0 0 1 来设置我的应用程序。 每次我运行 grunt 时,我的地址都是 http://127.0.0.1:9000/#/ ...我尝试了很多东西,但没有任何效果...我总是被重定向到那个地方。

这是我的文件:

httpd.conf

<VirtualHost *:80>
    DocumentRoot "/Users/myusername/Sites/MyApp/app"
    ServerName myapp.dev
    <Directory "/Users/myusername/Sites/MyApp/app">
    Options FollowSymLinks MultiViews Indexes
    AllowOverride All
    Order allow,deny
    Deny from none
    Allow from all
    </Directory>
</VirtualHost>

主机

127.0.0.1 myapp.dev
::1 myapp.dev

Gruntfile.js

// Generated on 2013-11-08 using generator-angular 0.5.1
'use strict';

// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/,*/*.js'
// use this if you want to recursively match all subfolders:
// 'test/spec/**/*.js'

module.exports = function (grunt) 
  require('load-grunt-tasks')(grunt);
  require('time-grunt')(grunt);

  grunt.initConfig(
    yeoman: 
      // configurable paths
      app: require('./bower.json').appPath || 'app',
      dist: 'dist'
    ,
    watch: 
      coffee: 
        files: ['<%= yeoman.app %>/scripts/,*/*.coffee'],
        tasks: ['coffee:dist']
      ,
      coffeeTest: 
        files: ['test/spec/,*/*.coffee'],
        tasks: ['coffee:test']
      ,
      compass: 
        files: ['<%= yeoman.app %>/styles/,*/*.scss,sass'],
        tasks: ['compass:server', 'autoprefixer']
      ,
      styles: 
        files: ['<%= yeoman.app %>/styles/,*/*.css'],
        tasks: ['copy:styles', 'autoprefixer']
      ,
      livereload: 
        options: 
          livereload: '<%= connect.options.livereload %>'
        ,
        files: [
          '<%= yeoman.app %>/,*/*.html',
          '.tmp/styles/,*/*.css',
          '.tmp,<%= yeoman.app %>/scripts/,*/*.js',
          '<%= yeoman.app %>/images/,*/*.png,jpg,jpeg,gif,webp,svg'
        ]
      
    ,
    autoprefixer: 
      options: ['last 1 version'],
      dist: 
        files: [
          expand: true,
          cwd: '.tmp/styles/',
          src: ',*/*.css',
          dest: '.tmp/styles/'
        ]
      
    ,
    connect: 
      options: 
        port: 9000,
        // Change this to '0.0.0.0' to access the server from outside.
        hostname: 'myapp.dev',
        livereload: 35729
      ,
      livereload: 
        options: 
          open: true,
          base: [
            '.tmp',
            '<%= yeoman.app %>'
          ]
        
      ,
      test: 
        options: 
          port: 9001,
          base: [
            '.tmp',
            'test',
            '<%= yeoman.app %>'
          ]
        
      ,
      dist: 
        options: 
          base: '<%= yeoman.dist %>'
        
      
    ,
    clean: 
      dist: 
        files: [
          dot: true,
          src: [
            '.tmp',
            '<%= yeoman.dist %>/*',
            '!<%= yeoman.dist %>/.git*'
          ]
        ]
      ,
      server: '.tmp'
    ,
    jshint: 
      options: 
        jshintrc: '.jshintrc'
      ,
      all: [
        'Gruntfile.js',
        '<%= yeoman.app %>/scripts/,*/*.js'
      ]
    ,
    coffee: 
      options: 
        sourceMap: true,
        sourceRoot: ''
      ,
      dist: 
        files: [
          expand: true,
          cwd: '<%= yeoman.app %>/scripts',
          src: ',*/*.coffee',
          dest: '.tmp/scripts',
          ext: '.js'
        ]
      ,
      test: 
        files: [
          expand: true,
          cwd: 'test/spec',
          src: ',*/*.coffee',
          dest: '.tmp/spec',
          ext: '.js'
        ]
      
    ,
    compass: 
      options: 
        sassDir: '<%= yeoman.app %>/styles',
        cssDir: '.tmp/styles',
        generatedImagesDir: '.tmp/images/generated',
        imagesDir: '<%= yeoman.app %>/images',
        javascriptsDir: '<%= yeoman.app %>/scripts',
        fontsDir: '<%= yeoman.app %>/styles/fonts',
        importPath: '<%= yeoman.app %>/bower_components',
        httpImagesPath: '/images',
        httpGeneratedImagesPath: '/images/generated',
        httpFontsPath: '/styles/fonts',
        relativeAssets: false
      ,
      dist: ,
      server: 
        options: 
          debugInfo: true
        
      
    ,
    // not used since Uglify task does concat,
    // but still available if needed
    /*concat: 
      dist: 
    ,*/
    rev: 
      dist: 
        files: 
          src: [
            '<%= yeoman.dist %>/scripts/,*/*.js',
            '<%= yeoman.dist %>/styles/,*/*.css',
            '<%= yeoman.dist %>/images/,*/*.png,jpg,jpeg,gif,webp,svg',
            '<%= yeoman.dist %>/styles/fonts/*'
          ]
        
      
    ,
    useminPrepare: 
      html: '<%= yeoman.app %>/index.html',
      options: 
        dest: '<%= yeoman.dist %>'
      
    ,
    usemin: 
      html: ['<%= yeoman.dist %>/,*/*.html'],
      css: ['<%= yeoman.dist %>/styles/,*/*.css'],
      options: 
        dirs: ['<%= yeoman.dist %>']
      
    ,
    imagemin: 
      dist: 
        files: [
          expand: true,
          cwd: '<%= yeoman.app %>/images',
          src: ',*/*.png,jpg,jpeg',
          dest: '<%= yeoman.dist %>/images'
        ]
      
    ,
    svgmin: 
      dist: 
        files: [
          expand: true,
          cwd: '<%= yeoman.app %>/images',
          src: ',*/*.svg',
          dest: '<%= yeoman.dist %>/images'
        ]
      
    ,
    cssmin: 
      // By default, your `index.html` <!-- Usemin Block --> will take care of
      // minification. This option is pre-configured if you do not wish to use
      // Usemin blocks.
      // dist: 
      //   files: 
      //     '<%= yeoman.dist %>/styles/main.css': [
      //       '.tmp/styles/,*/*.css',
      //       '<%= yeoman.app %>/styles/,*/*.css'
      //     ]
      //   
      // 
    ,
    htmlmin: 
      dist: 
        options: 
          /*removeCommentsFromCDATA: true,
          // https://github.com/yeoman/grunt-usemin/issues/44
          //collapseWhitespace: true,
          collapseBooleanAttributes: true,
          removeAttributeQuotes: true,
          removeRedundantAttributes: true,
          useShortDoctype: true,
          removeEmptyAttributes: true,
          removeOptionalTags: true*/
        ,
        files: [
          expand: true,
          cwd: '<%= yeoman.app %>',
          src: ['*.html', 'views/*.html'],
          dest: '<%= yeoman.dist %>'
        ]
      
    ,
    // Put files not handled in other tasks here
    copy: 
      dist: 
        files: [
          expand: true,
          dot: true,
          cwd: '<%= yeoman.app %>',
          dest: '<%= yeoman.dist %>',
          src: [
            '*.ico,png,txt',
            '.htaccess',
            'bower_components/**/*',
            'images/,*/*.gif,webp',
            'styles/fonts/*'
          ]
        , 
          expand: true,
          cwd: '.tmp/images',
          dest: '<%= yeoman.dist %>/images',
          src: [
            'generated/*'
          ]
        ]
      ,
      styles: 
        expand: true,
        cwd: '<%= yeoman.app %>/styles',
        dest: '.tmp/styles/',
        src: ',*/*.css'
      
    ,
    concurrent: 
      server: [
        'coffee:dist',
        'compass:server',
        'copy:styles'
      ],
      test: [
        'coffee',
        'compass',
        'copy:styles'
      ],
      dist: [
        'coffee',
        'compass:dist',
        'copy:styles',
        'imagemin',
        'svgmin',
        'htmlmin'
      ]
    ,
    karma: 
      unit: 
        configFile: 'karma.conf.js',
        singleRun: true
      
    ,
    cdnify: 
      dist: 
        html: ['<%= yeoman.dist %>/*.html']
      
    ,
    ngmin: 
      dist: 
        files: [
          expand: true,
          cwd: '<%= yeoman.dist %>/scripts',
          src: '*.js',
          dest: '<%= yeoman.dist %>/scripts'
        ]
      
    ,
    uglify: 
      dist: 
        files: 
          '<%= yeoman.dist %>/scripts/scripts.js': [
            '<%= yeoman.dist %>/scripts/scripts.js'
          ]
        
      
    
  );

  grunt.registerTask('server', function (target) 
    if (target === 'dist') 
      return grunt.task.run(['build', 'connect:dist:keepalive']);
    

    grunt.task.run([
      'clean:server',
      'concurrent:server',
      'autoprefixer',
      'connect:livereload',
      'watch'
    ]);
  );

  grunt.registerTask('test', [
    'clean:server',
    'concurrent:test',
    'autoprefixer',
    'connect:test',
    'karma'
  ]);

  grunt.registerTask('build', [
    'clean:dist',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'copy:dist',
    'cdnify',
    'ngmin',
    'cssmin',
    'uglify',
    'rev',
    'usemin'
  ]);

  grunt.registerTask('default', [
    'jshint',
    'test',
    'build'
  ]);
;

【问题讨论】:

【参考方案1】:

这里不需要 Apache。 Connect 是一个 Web 服务器,因此它已经为您的静态文件提供服务。尝试禁用 Apache 并将您的 hostname 选项更改为 localhost。

【讨论】:

【参考方案2】:

@Dmitry Nikitenko 是正确的,您不需要 Apache。你需要改变你的 Gruntfile

hostname 选项仅用于指定 livereload 应连接到的位置。这不会更改启动 Grunt 时打开的默认 url。您需要在 livereload 选项中为 open 指定一个 URL。例如:

  livereload: 
    options: 
      open: 'http://myapp.dev:9000',
      base: [
        '.tmp',
        '<%= yeoman.app %>'
      ]
    

【讨论】:

以上是关于Grunt 服务器没有为我的应用程序使用虚拟主机名。vhost 和 httpd 已设置,但 grunt 没有使用它们的主要内容,如果未能解决你的问题,请参考以下文章

用于将 ip 重定向到主机名的 Apache httpd.conf

正确发布一个 grunt 项目

在 Flask 中获取没有端口的主机名

Yeoman Angular.js grunt serve-d 应用程序从 livereload.js?snipver=1 延迟很长

部署到 EB 的 Django 应用程序无法翻译主机名

使用 grunt 服务器,如何将所有请求重定向到根 url?