Gruntfile не работает при запуске команды сборки grunt
Я использовал yoman для создания моей структуры с помощью "yo webapp", я исключил все дополнительные функции во время процесса установки через npm и вручную загрузил файлы начальной загрузки.
Я пытаюсь запустить команду "grunt build", которая должна принимать все в папке приложения (и ее подпапках и их подпапке и т.д.) и создавать, компилировать, объединять и минимизировать файлы в папку dist в родительский каталог (на том же уровне, что и приложение), так как я уверен, что кто-нибудь, кто использовал йоман и хрюканье, знает.
По какой-то причине он этого не сделает, и я попытался изменить пути по умолчанию и т.д. в файле grunt, чтобы попытаться заставить его работать, но он работает некорректно (если честно, работа на всех более склонна, хотя она говорит в cmd, что она делает).
Он завершает задачу сборки в соответствии с cmd сейчас (раньше он не утверждал, что возникла проблема с задачей imagemin, но я изменил ее, и теперь она работает (или так говорит)), но когда я смотрю в папке dist есть только файл index.html и файл стилей (который не включает некоторые из файлов css, которые он должен...).
Вот важная часть моей структуры папок:
Site
├───.tmp
│ ├───spec
│ └───styles
├───app
├───fonts
├───images
│ ├───home
│ ├───payments
│ └───profile
├───scripts
│ ├───JS
│ ├───PHP
└───styles
Папка .tmp автоматически создается по какой-либо причине, я предполагаю, что она помогает хрюкать с чем-то, поскольку она создается, когда я сохраняю файлы в папке приложения, и хрюкает, наблюдая.
Все, что я хочу, просто:
- Чтобы запустить "сборку grunt"
- Чтобы получить хруст, пройдите через все папки и файлы.
- Чтобы объединить, модифицировать, воссоздать, перемещать и создавать файлы, как и ожидалось (если вы использовали йоман и хрюкаете вместе, вы будете знать, что я имею в виду и ожидаю, более метко).
- Для вывода в папку dist
Если это помогает, то его типы файлов в папках будут такими же, как и следовало ожидать, в папке с шрифтом [EOT, TTF, OTF, WOFF, SVG], изображениях и его подпапках используются [PNG, JPEG, GIF], скрипты имеют [JS, PHP] сам по себе, а его подпапки и стили имеют [SASS, SCSS, CSS], но, очевидно, это просто CSS, который мне очень нравится при перемещении на dist.
Возможно, это осложнило ваш ум, но, надеюсь, вы знаете, что я ожидаю после работы с йоменом и хрюкать перед собой и могу помочь мне решить задачи и движение.
Вот мой файл grunt в его нынешнем виде:
// Generated on 2015-11-17 using
// generator-webapp 1.1.0
'use strict';
// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,*/}*.js'
// If you want to recursively match all subfolders, use:
// 'test/spec/**/*.js'
module.exports = function (grunt) {
// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);
// Automatically load required grunt tasks
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin'
});
// Configurable paths
var config = {
app: 'app',
dist: 'dist'
};
// Define the configuration for all the tasks
grunt.initConfig({
// Project settings
config: config,
// Watches files for changes and runs tasks based on the changed files
watch: {
bower: {
files: ['bower.json'],
tasks: ['wiredep']
},
babel: {
files: ['<%= config.app %>/scripts/{,*/}*.js'],
tasks: ['babel:dist']
},
babelTest: {
files: ['test/spec/{,*/}*.js'],
tasks: ['babel:test', 'test:watch']
},
gruntfile: {
files: ['Gruntfile.js']
},
styles: {
files: ['<%= config.app %>/styles/{,*/}*.css'],
tasks: ['newer:copy:styles', 'postcss']
}
},
browserSync: {
options: {
notify: false,
background: true,
watchOptions: {
ignored: ''
}
},
livereload: {
options: {
files: [
'<%= config.app %>/{,*/}*.html',
'.tmp/styles/{,*/}*.css',
'<%= config.app %>/images/{,*/}*',
'.tmp/scripts/{,*/}*.js'
],
port: 9000,
server: {
baseDir: ['.tmp', config.app],
routes: {
'/bower_components': './bower_components'
}
}
}
},
test: {
options: {
port: 9001,
open: false,
logLevel: 'silent',
host: 'localhost',
server: {
baseDir: ['.tmp', './test', config.app],
routes: {
'/bower_components': './bower_components'
}
}
}
},
dist: {
options: {
background: false,
server: '<%= config.dist %>'
}
}
},
// Empties folders to start fresh
clean: {
dist: {
files: [{
dot: true,
src: [
'.tmp',
'<%= config.dist %>/*',
'!<%= config.dist %>/.git*'
]
}]
},
server: '.tmp'
},
// Make sure code styles are up to par and there are no obvious mistakes
eslint: {
target: [
'Gruntfile.js',
'<%= config.app %>/scripts/{,*/}*.js',
'!<%= config.app %>/scripts/vendor/*',
'test/spec/{,*/}*.js'
]
},
// Mocha testing framework configuration options
mocha: {
all: {
options: {
run: true,
urls: ['http://<%= browserSync.test.options.host %>:<%= browserSync.test.options.port %>/index.html']
}
}
},
// Compiles ES6 with Babel
babel: {
options: {
sourceMap: true
},
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/scripts/*',
src: '{,*/}*.js',
dest: '.tmp/scripts',
ext: '.js'
}]
},
test: {
files: [{
expand: true,
cwd: 'test/spec',
src: '{,*/}*.js',
dest: '.tmp/spec',
ext: '.js'
}]
}
},
postcss: {
options: {
map: true,
processors: [
// Add vendor prefixed styles
require('autoprefixer')({
browsers: ['> 1%', 'last 2 versions', 'Firefox ESR']
})
]
},
dist: {
files: [{
expand: true,
cwd: '.tmp/styles/',
src: '{,*/}*.css',
dest: '.tmp/styles/'
}]
}
},
// Automatically inject Bower components into the HTML file
wiredep: {
app: {
src: ['<%= config.app %>/index.html'],
ignorePath: /^(\.\.\/)*\.\./
}
},
// Renames files for browser caching purposes
filerev: {
dist: {
src: [
'<%= config.dist %>/scripts/{,*/}*.js',
'<%= config.dist %>/styles/{,*/}*.css',
'<%= config.dist %>/images/{,*/}*.*',
'<%= config.dist %>/styles/fonts/{,*/}*.*',
'<%= config.dist %>/*.{ico,png}'
]
}
},
// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
options: {
dest: '<%= config.dist %>'
},
html: '<%= config.app %>/index.html'
},
// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
options: {
assetsDirs: [
'<%= config.dist %>',
'<%= config.dist %>/images',
'<%= config.dist %>/styles'
]
},
html: ['<%= config.dist %>/{,*/}*.html'],
css: ['<%= config.dist %>/styles/{,*/}*.css']
},
// The following *-min tasks produce minified files in the dist folder
imagemin: {
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/images/*',
src: '{,*/}*.*',
dest: '<%= config.dist %>/images'
}]
}
},
svgmin: {
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/images',
src: '{,*/}*.svg',
dest: '<%= config.dist %>/images'
}]
}
},
htmlmin: {
dist: {
options: {
collapseBooleanAttributes: true,
collapseWhitespace: true,
conservativeCollapse: true,
removeAttributeQuotes: true,
removeCommentsFromCDATA: true,
removeEmptyAttributes: true,
removeOptionalTags: true,
// true would impact styles with attribute selectors
removeRedundantAttributes: false,
useShortDoctype: true
},
files: [{
expand: true,
cwd: '<%= config.dist %>',
src: '{,*/}*.html',
dest: '<%= config.dist %>'
}]
}
},
cssmin: {
dist: {
files: {
'<%= config.dist %>/styles/main.css': [
'.tmp/styles/{,*/}*.css',
'<%= config.app %>/styles/{,*/}*.css'
]
}
}
},
uglify: {
dist: {
files: {
'<%= config.dist %>/scripts/scripts.js': [
'<%= config.dist %>/scripts/scripts.js'
]
}
}
},
concat: {
dist: {}
},
// Copies remaining files to places other tasks can use
copy: {
dist: {
files: [{
expand: true,
dot: true,
cwd: '<%= config.app %>',
dest: '<%= config.dist %>',
src: [
'*.{ico,png,txt}',
'images/{,*/}*.webp',
'{,*/}*.html',
'styles/fonts/{,*/}*.*'
]
}]
},
styles: {
expand: true,
dot: true,
cwd: '<%= config.app %>/styles',
dest: '.tmp/styles/',
src: '{,*/}*.css'
}
},
// Run some tasks in parallel to speed up build process
concurrent: {
server: [
'babel:dist',
'copy:styles'
],
test: [
'babel',
'copy:styles'
],
dist: [
'babel',
'copy:styles',
'imagemin',
'svgmin'
]
}
});
grunt.registerTask('serve', 'start the server and preview your app', function (target) {
if (target === 'dist') {
return grunt.task.run(['build', 'browserSync:dist']);
}
grunt.task.run([
'clean:server',
'wiredep',
'concurrent:server',
'postcss',
'browserSync:livereload',
'watch'
]);
});
grunt.registerTask('server', function (target) {
grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.');
grunt.task.run([target ? ('serve:' + target) : 'serve']);
});
grunt.registerTask('test', function (target) {
if (target !== 'watch') {
grunt.task.run([
'clean:server',
'concurrent:test',
'postcss'
]);
}
grunt.task.run([
'browserSync:test',
'mocha'
]);
});
grunt.registerTask('build', [
'clean:dist',
'wiredep',
'useminPrepare',
'concurrent:dist',
'postcss',
'concat',
'cssmin',
'uglify',
'copy:dist',
'filerev',
'usemin',
'htmlmin'
]);
grunt.registerTask('default', [
'newer:eslint',
'test',
'build'
]);
};
Я бы сделал скриншоты, чтобы показать вам проблему, но, как я уже сказал, когда я запускаю "сборку grunt", она проходит согласно CMD, но на самом деле не делает того, что ожидается, как я объяснил.
Если вам нужны какие-либо разъяснения, дайте мне знать.
Приветствия,
- SD
Ответы
Ответ 1
Вы никогда не говорили, если бы чистый веб-папер работал на вас. Поскольку вы уже попробовали повторно установить yoman и т.д. И обновили модули npm, я попытался бы создать новый проект webapp. И не трогая его, запустите grunt build, чтобы узнать, что произойдет.
yo webapp
bower install
grunt build
Если он не работает, отправьте сообщение об ошибке, которую вы получаете. Если он работает, скопируйте текущие файлы/папки приложения в новый проект и повторите попытку.