无法实现grunt-connect-proxy [英] Can't implement grunt-connect-proxy
本文介绍了无法实现grunt-connect-proxy的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
http://127.0.0.1:9000/ ）路线我得到
无法获得/
并且为/ v1路线获得
未找到
在此服务器上找不到请求的网址/ v1。
这是我的Gruntfile.js：
//生成2013-10-08使用generator-webapp 0.4.3
'use strict';
//＃Globbing
//出于性能原因，我们只匹配一个级别：
//'test / spec / {，* /} *。js'
//如果您要递归匹配所有子文件夹，请使用此命令：
//'test / spec / ** / *。js'
/ * = ===========================================
= Expose Prxy Function =
============================================ * /
var proxySnippet = require（'grunt-connect-proxy / lib / utils'）。proxyRequest;
$ b $ / * ----- Expose结束Prxy函数------ * /
module.exports = function（ grunt）{
//显示最后消耗的时间
require（'time-grunt'）（grunt）;
//载入所有grunt任务
require（'load-grunt-tasks'）（grunt）;
/ * ================================ ======
=载入代理=
=============================== ======= * /
grunt.loadNpmTasks（'grunt-connect-proxy'）;
/ * -----结束加载代理------ * /
grunt。 initConfig（{
//可配置路径
yeoman：{
app：'app'，
dist：'dist'
}，
watch：{
compass：{
files：['<％= yeoman.app％> / styles / {，* /} *。{scss，sass}']，
tasks：[ 'compass：server'，'autoprefixer']
}，
styles：{
files：['<％= yeoman.app％> / styles / {，* /} * .css']，
任务：['copy：styles'，'autoprefixer']
}，
livereload：{
options：{
livereload：'< ;％= connect.options.livereload％>'
}，
文件：[
'<％= yeoman.app％> / *。html'，
'.tmp / styles / {，* /} * .css'，
'{.tmp，<％= yeoman.app％>} / scripts / {，* /} *。js'，
'<％= yeoman.app％> / images / {，* /}*.{png,jpg,jpeg,gif,webp,svg}'
]
}
}，
connect：{
options ：{
port：9000，
livereload：35729，
//将其改为'0.0.0.0'以从外部访问服务器
hostname：'localhost'
}，
/ * ===============================
=代理=
=============================== * /
代理：[
{
上下文：'/ v1'，
主机：'apples.dev'，
端口：80，
https：false，
changeOrigin：true ，
xforward：false
}
]，
/ * -----代理结束------ * /
livereload：{
options：{
middleware：function（connect，options）{
return [
proxySnippet，
connect.static（'<％= yeoman.app％>' ），
connect.static（'。tmp'），
];
，
open：true，
base：[
'.tmp'，
'<％= yeoman.app％>'
]，
}
}，
// livereload：{
//选项：{
// open：true，
// base：[
//'.tmp'，
//'<％= yeoman.app％>'
//]
// }
//}，
测试：{
选项：{
base：[
'.tmp'，
'test'，
'<％= yeoman.app％>'
]
}
}，
dist：{
options： {
打开：true，
base：'<％= yeoman.dist％>'
}
}
}，
clean：{
dist ：{
files：[{
dot：true，
src：[
'.tmp'，
'<％= yeoman.dist％> / *'，
'！<％= yeoman.dist％> /。git *'
]
}]
}，
server：'.tmp '
}，
jshint：{
选项：{
jshintrc：'.jshintrc'
}，
全部：[
'Gruntfile .js'，
'<％= yeoman.app％> / scripts / {，* /} *。js'，
'！<％= yeoman.app％> / scripts / vendor / *'，
'test / spec / {，* /} *。js'
]
}，
moch a：{
all：{
options：{
run：true，
urls：['http：//<％= connect.test.options.hostname％> ;：<％= connect.test.options.port％> /index.html']
}
}
}，
指南针：{
选项：{
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：'/ sty les / fonts'，
relativeAssets：false，
assetCacheBuster：false
}，
dist：{
options：{
generatedImagesDir：'<％ = yeoman.dist％> / images / generated'
}
}，
server：{
options：{
debugInfo：true
}
}，
autoprefixer：{
options：{
browsersers：['last 1 version']
}，
dist：{
文件：[{
expand：true，
cwd：'.tmp / styles /'，
src：'{，* /} *。css'，
dest：'.tmp / styles /'
}]
}
}，
//因为Uglify任务没有使用concat，所以
//但仍然可用一世f需要
/ * concat：{
dist：{}
}，* /
rev：{
dist：{
files：{
src：[
'<％= yeoman.dist％> / scripts / {，* /} *。js'，
'<％= yeoman.dist％> / styles /{,*/}*.css'，
'<％= yeoman.dist％> / images / {，* /} *。{png，jpg，jpeg，gif，webp}'，
'<％= yeoman.dist％> / styles / fonts /{,*/}*.*'
]
}
}
}，
useminPrepare：{
options：{
dest：'<％= yeoman.dist％>'
}，
html：'<％= yeoman。 app％> /index.html'
}，
usemin：{
options：{
dirs：['<％= yeoman.dist％>']
}，
html：['<％= yeoman.dis t％> / {，* /} *。html']，
css：['<％= yeoman.dist％> / styles / {，* /} * .css']
}，
imagemin：{
dist：{
files：[{
expand：true，
cwd：'<％= yeoman.app％> / images'，
src：'{，* /} *。{png，jpg，jpeg}'，
dest：'<％= yeoman.dist％> / images'
$ b svgmin {
dist：{
files：[{
expand：true，
cwd： '<％= yeoman.app％> / images'，
src：'{，* /} *。svg'，
dest：'<％= yeoman.dist％> /图像'
}]
}
}，
cssmin：{
//如果您不想使用Usemin
，则此任务已预先配置//为您的CSS块。默认情况下，
//``index.html`中的Usemin块将处理缩小，例如
//
//<！ - build：css（{。tmp，app}）styles / main.css - >
//
// dist：{
//文件：{
//'<％= 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'，
dest：'<％= yeoman.dist％>'
}]
}
}，
//将未在其他任务中处理的文件放在这里
copy：{
dist：{
files：[{
expand：true，
dot：true，
cwd：'<％= yeoman.app ％>'，
dest：'<％= yeoman.dist％>'，
src：[
'*。{ico，png，txt}'，
'.htaccess'，
'images / {，* /} *。{webp，gif}'，
'styles / fonts /{,*/}*.*'，
'bower_components / sass-bootstrap / fonts /*.*'
]
}]
}，
styles：{
expand：true，
dot：true，
cwd：'<％= yeoman.app％> / styles '，
dest：'.tmp / styles /'，
src：'{，* /} *。css'
}
}，
modernizr：{
devFile：'<％= yeoman.app％> /bower_components/modernizr/modernizr.js'，
outputFile：'<％= yeoman.dist％> / bower_components / modernizr / modernizr .js'，
文件：[
'<％= yeoman.dist％> / scripts / {，* /} *。js'，
'<％= yeoman。 dist％> / styles / {，* /} * .css'，
'！<％= yeoman.dist％> / scripts / vendor / *'
]，
uglify：true
}，
concurrent：{
server：[
'compass'，
'copy：styles'
]，
test：[
'copy：styles'
]，
dist：[
'compass'，
'copy'styles'，
'imagemin'，
'svgmin'，
'htmlmin'
]
}，
bower：{
options：{
exclude： ['modernizr']
}，
all：{
rjsConfig：'<％= yeoman.app％> /scripts/main.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'，
'configureProxies'，
'connect：livereload'，
'watch'
））;
}）;
grunt.registerTask（'test'，[
'clean：server'，
'concurrent'test'，$ b $'autoprefixer'，
' connect：test'，
'mocha'
]）;
grunt.registerTask（'build'，[
'clean：dist'，
'useminPrepare'，
'concurrent'dist'，
' autoprefixer'，
'concat'，
'cssmin'，
'uglify'，
'modernizr'，
'copy'dist'，
' rev'，
'usemin'
]）;
grunt.registerTask（'default'，[
'jshint'，
'test'，
'build'
]）;
};
澄清一下：apples.dev:80是一个本地虚拟主机，'/ v1 '包含所有其他资源。
解决方案
考虑到/ v1路由，事实证明这是Apache虚拟主机错误配置。
至于'/'（ http://127.0.0.1:9000/ ）路线，改为这个：
middleware：function（connect，options）{
return [
proxySnippet，
connect.static（'<％= yeoman.app％>'），
connect.static（'。tmp'）
];
}，
我使用了它：
middleware：function（connect，options）{
var middlewares = [];
options.base.forEach（function（base）{
//服务静态文件
middlewares.push（connect.static（base））;
}）;
middlewares.push（proxySnippet）;
返回中间件;
};
现在..如果任何人都可以告诉我.. figgin的区别是什么？！
For the '/' (http://127.0.0.1:9000/) route i get
Cannot GET /
and for the /v1 route i get
Not Found
The requested URL /v1 was not found on this server.
Here's my Gruntfile.js:
// Generated on 2013-10-08 using generator-webapp 0.4.3
'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'
/*============================================
= Expose Prxy Function =
============================================*/
var proxySnippet = require('grunt-connect-proxy/lib/utils').proxyRequest;
/*----- End of Expose Prxy Function ------*/
module.exports = function (grunt) {
// show elapsed time at the end
require('time-grunt')(grunt);
// load all grunt tasks
require('load-grunt-tasks')(grunt);
/*======================================
= load the proxy =
======================================*/
grunt.loadNpmTasks('grunt-connect-proxy');
/*----- End of load the proxy ------*/
grunt.initConfig({
// configurable paths
yeoman: {
app: 'app',
dist: 'dist'
},
watch: {
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}'
]
}
},
connect: {
options: {
port: 9000,
livereload: 35729,
// change this to '0.0.0.0' to access the server from outside
hostname: 'localhost'
},
/*===============================
= Proxies =
===============================*/
proxies: [
{
context: '/v1',
host: 'apples.dev',
port: 80,
https: false,
changeOrigin: true,
xforward: false
}
],
/*----- End of Proxies ------*/
livereload: {
options: {
middleware: function (connect, options) {
return [
proxySnippet,
connect.static('<%= yeoman.app %>'),
connect.static('.tmp'),
];
},
open: true,
base: [
'.tmp',
'<%= yeoman.app %>'
],
}
},
// livereload: {
// options: {
// open: true,
// base: [
// '.tmp',
// '<%= yeoman.app %>'
// ]
// }
// },
test: {
options: {
base: [
'.tmp',
'test',
'<%= yeoman.app %>'
]
}
},
dist: {
options: {
open: true,
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',
'!<%= yeoman.app %>/scripts/vendor/*',
'test/spec/{,*/}*.js'
]
},
mocha: {
all: {
options: {
run: true,
urls: ['http://<%= connect.test.options.hostname %>:<%= connect.test.options.port %>/index.html']
}
}
},
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,
assetCacheBuster: false
},
dist: {
options: {
generatedImagesDir: '<%= yeoman.dist %>/images/generated'
}
},
server: {
options: {
debugInfo: true
}
}
},
autoprefixer: {
options: {
browsers: ['last 1 version']
},
dist: {
files: [{
expand: true,
cwd: '.tmp/styles/',
src: '{,*/}*.css',
dest: '.tmp/styles/'
}]
}
},
// 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}',
'<%= yeoman.dist %>/styles/fonts/{,*/}*.*'
]
}
}
},
useminPrepare: {
options: {
dest: '<%= yeoman.dist %>'
},
html: '<%= yeoman.app %>/index.html'
},
usemin: {
options: {
dirs: ['<%= yeoman.dist %>']
},
html: ['<%= yeoman.dist %>/{,*/}*.html'],
css: ['<%= yeoman.dist %>/styles/{,*/}*.css']
},
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: {
// This task is pre-configured if you do not wish to use Usemin
// blocks for your CSS. By default, the Usemin block from your
// `index.html` will take care of minification, e.g.
//
// <!-- build:css({.tmp,app}) styles/main.css -->
//
// 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',
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',
'images/{,*/}*.{webp,gif}',
'styles/fonts/{,*/}*.*',
'bower_components/sass-bootstrap/fonts/*.*'
]
}]
},
styles: {
expand: true,
dot: true,
cwd: '<%= yeoman.app %>/styles',
dest: '.tmp/styles/',
src: '{,*/}*.css'
}
},
modernizr: {
devFile: '<%= yeoman.app %>/bower_components/modernizr/modernizr.js',
outputFile: '<%= yeoman.dist %>/bower_components/modernizr/modernizr.js',
files: [
'<%= yeoman.dist %>/scripts/{,*/}*.js',
'<%= yeoman.dist %>/styles/{,*/}*.css',
'!<%= yeoman.dist %>/scripts/vendor/*'
],
uglify: true
},
concurrent: {
server: [
'compass',
'copy:styles'
],
test: [
'copy:styles'
],
dist: [
'compass',
'copy:styles',
'imagemin',
'svgmin',
'htmlmin'
]
},
bower: {
options: {
exclude: ['modernizr']
},
all: {
rjsConfig: '<%= yeoman.app %>/scripts/main.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',
'configureProxies',
'connect:livereload',
'watch'
]);
});
grunt.registerTask('test', [
'clean:server',
'concurrent:test',
'autoprefixer',
'connect:test',
'mocha'
]);
grunt.registerTask('build', [
'clean:dist',
'useminPrepare',
'concurrent:dist',
'autoprefixer',
'concat',
'cssmin',
'uglify',
'modernizr',
'copy:dist',
'rev',
'usemin'
]);
grunt.registerTask('default', [
'jshint',
'test',
'build'
]);
};
Just to clarify: the apples.dev:80 is a local virtual host on which the '/v1' contains all the rest resources.
解决方案
Considering the /v1 route, it turned out that it was an Apache virtual-host misconfiguration.
As for the '/' (http://127.0.0.1:9000/) route, instead of this:
middleware: function (connect, options) {
return [
proxySnippet,
connect.static('<%= yeoman.app %>'),
connect.static('.tmp')
];
},
I made it work with this:
middleware: function (connect, options) {
var middlewares = [];
options.base.forEach(function(base) {
// Serve static files.
middlewares.push(connect.static(base));
});
middlewares.push(proxySnippet);
return middlewares;
};
Now.. if anyone could tell me.. what is the figgin difference?!
这篇关于无法实现grunt-connect-proxy的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
