I'm trying to move from Assetic to Webpack but it seems quite tricky.
I have 6 different JS entries, containing different files.
I'm running "yarn encore dev":
Problem 1: I get "ERROR Failed to compile with 0 errors" - BUT it does seem to compile.
Problem 2: All compiled entries are almost identical (same size) except the first one. All that change is the filename written inside the file.
Maybe it's not really compiling in fact, then how could I fix the "Failed to compile with 0 errors" error?
My webpack.config.js:
let Encore = require('#symfony/webpack-encore');
Encore
.setOutputPath('web/build/')
.setPublicPath('/build')
.setManifestKeyPrefix('build/')
//-- this one is well-compiled (I think)
.addEntry('app-vendors', './assets/app-vendors.js')
//-- those ones are all identical
.addEntry('app-classes', './assets/app-classes.js')
.addEntry('markable-maps-classes', './assets/markable-maps-classes.js')
.addEntry('markable-maps-vendors', './assets/markable-maps-vendors.js')
.addEntry('calendar-vendors', './assets/calendar-vendors.js')
.addEntry('calendar-classes', './assets/calendar-classes.js')
.enableSingleRuntimeChunk()
;
var config = Encore.getWebpackConfig();
config.node = { fs: 'empty' };
module.exports = config;
app-classes.js
let files = [
'classes/Foldable.js',
'classes/HorizontalPlanning.js',
'classes/PlanningWorkTimes.js',
'classes/AttachmentsList.js',
'classes/CameraModal.js',
'classes/Affair.js',
'classes/AffairStepsFinancialInfos.js',
'classes/Forms.js',
'classes/NewEventContextMenu.js',
'classes/GroupAction.js',
'classes/AuthRights.js',
'functions.js',
'init.js'
];
for (let file of files)
require('../web/js/Business/' + file);
calendar-classes.js
let files = [
'classes/Calendars/BaseCalendar.js',
'classes/Calendars/SingleCalendar.js',
'classes/Calendars/SyncCalendars.js',
'classes/Calendars/EmployeesSyncCalendars.js',
'classes/Calendars/Planning.js',
'classes/Calendars/RoomsSyncCalendars.js',
];
for (let file of files)
require('../web/js/Business/' + file);
calendar-vendors.js
let files = [
'fullcalendar/fullcalendar.js',
'fullcalendar/locale/fr.js',
];
for (let file of files)
require('../web/js/Business/' + file);
Command output:
$ yarn encore dev
yarn run v1.16.0
$ '/Volumes/Macintosh HD Data/Users/theredled/Sites/qualispace/deploy/node_modules/.bin/encore' dev
Running webpack ...
ERROR Failed to compile with 0 errors 17:11:12
Entrypoint app-vendors [big] = app-vendors.css app-vendors.js
Entrypoint app-classes [big] = app-classes.js
Entrypoint markable-maps-classes [big] = markable-maps-classes.js
Entrypoint markable-maps-vendors [big] = markable-maps-vendors.js
Entrypoint calendar-vendors [big] = calendar-vendors.js
Entrypoint calendar-classes [big] = calendar-classes.js
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Related
I have a symfony 4 project using webpack. When I run:
yarn encore dev --watch
it cleans the directory and delete the symbolic link.
I want to preserve the symbolic link, because a background process is writing on it files.
The symb link is created using:
ln -s /dev/shm/mpeg-dash /public/build/video
This is my webpack.config.js:
var webpack = require('webpack');
var Encore = require('#symfony/webpack-encore');
var CopyWebpackPlugin = require('copy-webpack-plugin');
Encore
//the project directory where compiled assets will be stored
.setOutputPath('public/build/')
//the public path used by the web server to access the previous directory
.setPublicPath('/build')
.cleanupOutputBeforeBuild()
.enableSourceMaps(!Encore.isProduction())
//uncomment to define the assets of the project
.createSharedEntry('js/app', './assets/js/app.js')
.addEntry('js/profile', './assets/js/profile.js')
.addEntry('js/users', './assets/js/users-list.js')
.addEntry('js/blacklist', './assets/js/blacklist-index.js')
.addEntry('js/mailaddress', './assets/js/mailaddress.js')
.addEntry('js/vehicles', './assets/js/vehicles.js')
.addEntry('js/vehicles-form', './assets/js/vehicles-form.js')
.addEntry('js/vehicles-import', './assets/js/import-vehicles.js')
.addEntry('js/devices', './assets/js/devices.js')
.addEntry('js/devices-form', './assets/js/devices-form.js')
.addEntry('js/devices-show', './assets/js/devices-show.js')
.addEntry('js/detections', './assets/js/detections.js')
.addEntry('js/atex_vehicle', './assets/js/atex_vehicle.js')
.addEntry('js/atex_driver', './assets/js/atex_driver.js')
.addEntry('js/fdv', './assets/js/fdv-index.js')
.addEntry('js/statistics', './assets/js/statistics.js')
.addEntry('js/translation-overview', './assets/js/translation-overview.js')
.addEntry('js/grid', './assets/js/grid.js')
.addStyleEntry('css/app', './assets/css/app.scss')
.addStyleEntry('css/flags', './assets/css/flags.css')
.addPlugin(new CopyWebpackPlugin([
{from: './assets/images', to: 'images'},
{from: './assets/fonts', to: 'fonts'},
{from: '././assets/js/jsmpeg.min.js', to: 'js/jsmpeg.min.js'},
{from: '././assets/files/import', to: 'files/import'}
]))
.addPlugin(new webpack.ContextReplacementPlugin(/\.\/locale$/, 'empty-module', false, /js$/))
//uncomment if you use Sass/SCSS files
.enableSassLoader()
//uncomment for legacy applications that require $/jQuery as a global variable
.autoProvidejQuery();
var config = Encore.getWebpackConfig();
module.exports = config;
How can I avoid deleting this symbolic link.
Thanks.
I got with the solution with this code:
.cleanupOutputBeforeBuild(['css/*', 'js/*', 'entrypoints.json', 'manifest.js', 'manifest.json'], (options) => {
options.verbose = true;
options.exclude = ['public/build/video/*'];
return options;
})
.cleanupOutputBeforeBuild(['**/*', '!video', '!video/**/*'])
I'm building my .NET Core app in Travis CI using Cake script, when it comes to
var d = new DirectoryInfo(packageOutputPath.ToString());
var Files = d.GetFiles("*.nupkg").Select(x => new FilePath(x.FullName));
var key = EnvironmentVariable("NugetKey");
NuGetPush(Files, new NuGetPushSettings {
Source = Variables.NugetSource,
ApiKey = key
command I get:
An error occurred when executing task 'PushPackage'.
Error: One or more errors occurred. (Permission denied)
Permission denied
My .travis.yml file:
sudo: required
language: csharp
mono: none
dotnet: 2.1.402
before_install:
- chmod +x build.sh
script:
- ./build.sh --Target="PushPackage"
I have tried replacing - ./build.sh --Target="PushPackage" with - sudo bash build.sh --Target="PushPackage" but this did not help. Any suggestions why I'm getting this error?
build.sh file was builded according to this. Whole repo is here.
You should be using the DotNetCoreNuGetPush alias when using the .NET CLI, NuGetPush requires nuget.exe.
Example:
DirectoryPath packageOutputPath = MakeAbsolute(Directory("./nuget/"));
var settings = new DotNetCoreNuGetPushSettings
{
Source = "https://www.example.com/nugetfeed",
ApiKey = "4003d786-cc37-4004-bfdf-c4f3e8ef9b3a"
};
foreach(var file in GetFiles($"{packageOutputPath}/*.nupkg"))
{
DotNetCoreNuGetPush(file.FullPath, settings);
}
I am learning Grunt and want to use load-grunt-config to start with. Here is my code :
Gruntfile.js
module.exports = function (grunt){
var path = require('path');
require('load-grunt-config')(grunt, {
configPath: path.join(process.cwd(), 'grunt-tasks'),
});
grunt.registerTask('install',['test']);
};
I have grunt-tasks folder in root directory of my project along with Gruntfile.js and in that I have included test.js
test.js
module.exports = {
test :{
local : {
}
}
};
Now when I say grunt install from command line and using CWD as my project's root directory I get following error :
Warning: Task "test" not found. Use --force to continue.
and when I include following segment in Gruntfile.js
loadGruntTasks : {
pattern : '*'
}
I get following error :
>> Local Npm module "load-grunt-config" not found. Is it installed?
Warning: Task "test" not found. Use --force to continue.
May I know what I don't understand here?
using gurunt syncall, I want to dynamically sync every dir(and new dir created in the futrue) in project root except 'node_modules' dir to another dir.
using grunt watchall, I want to watch those dirs, when there are some changes in a dir, I want to automaticlly run the corresponding sync task.
here is my project root's structure:
├── Gruntfile.js
├── addon1
│ └── a.toc
├── adon3
│ └── 3.toc
├── node_modules
│ ├── grunt
│ ├── grunt-contrib-watch
│ └── grunt-sync
└── package.json
the grunt syncall command is ok, here is the result:
➜ testsync grunt syncall
Running "config" task
Running "sync:addon1" (sync) task
Running "sync:adon3" (sync) task
Done, without errors.
but the grunt watchall not ok. can you tell me why watchall tasks not work and how to fix it?
I start the command, and change and save the file '3.toc' in dir 'adon3', then grunt say:
➜ testsync grunt watchall
Running "config" task
Running "watch" task
Waiting...
>> File "adon3/3.toc" changed.
Running "sync:adon3" (sync) task
Verifying property sync.adon3 exists in config...ERROR
>> Unable to process task.
Warning: Required config property "sync.adon3" missing. Use --force to continue.
Aborted due to warnings.
here is my Gruntfile.js:
module.exports = function(grunt) {
grunt.initConfig({});
var destdir = "/Users/morrxy/project/testdest/";
// dynamic config sync and watch's targets for every dir except for node_modules
grunt.registerTask('config', 'config sync and watch', function() {
grunt.file.expand({filter: 'isDirectory'},
['*', '!node_modules']).forEach(function(dir) {
// config sync's targets
var sync = grunt.config.get('sync') || {};
sync[dir] = {
files: [{
cwd: dir,
src: '**',
dest: destdir + dir
}]
};
grunt.config.set('sync', sync);
// config watch's target
var watch = grunt.config.get('watch') || {};
watch[dir] = {
files: dir + '/**/*',
// is next line has problem?
// running 'grunt watchall'
// when I change and save the file '3.toc' in dir 'adon3', terminal say:
// >> File "adon3/3.toc" changed.
// Running "sync:adon3" (sync) task
// Verifying property sync.adon3 exists in config...ERROR
// >> Unable to process task.
// Warning: Required config property "sync.adon3" missing.
// but why 'grunt syncall' can work?
tasks: 'sync:' + dir
};
grunt.config.set('watch', watch);
});
});
grunt.loadNpmTasks('grunt-sync');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('syncall', ['config', 'sync']);
grunt.registerTask('watchall', ['config', 'watch']);
};
Finally, I solved this problem. I add a github repo for this question. If you want test, you can clone it run it locally. https://github.com/morrxy/dynasync
The reason watchall can watch files changes but can't run the corresponding sync task is that when watch find files changed, the config for each sync is finnished running, so the config for that sync target is gone, we didn't save the running config any where. So to solve this problem, we could add the config task into the watch task before the sync task, like this tasks: ['config_sync', 'sync:' + dir].
in new Gruntfile.js, I split the config task to two task, one for config watch, one for config sync, in the watch task, using the config sync task. Here is the new Gruntfile.js
module.exports = function(grunt) {
var destdir = "/media/data/projects/dynasync_dest/";
grunt.loadNpmTasks('grunt-sync');
grunt.loadNpmTasks('grunt-contrib-watch');
// dynamic config sync's targets for every dir except for node_modules
grunt.registerTask('config_sync', 'dynamically config sync', function() {
grunt.file.expand({filter: 'isDirectory'},
['*', '!node_modules']).forEach(function(dir) {
// config this dir's sync target
var sync = grunt.config.get('sync') || {};
sync[dir] = {
files: [{
cwd: dir,
src: '**/*',
dest: destdir + dir
}]
};
grunt.config.set('sync', sync);
});
});
// dynamic config watch's targets for every dir except for node_modules
grunt.registerTask('config_watch', 'dynamically config watch', function() {
grunt.file.expand({filter: 'isDirectory'},
['*', '!node_modules']).forEach(function(dir) {
// config this dir's watch target
var watch = grunt.config.get('watch') || {};
watch[dir] = {
files: dir + '/**/*',
// this line solve the problem
// when find file change, first dynamically config sync and then sync the dir
tasks: ['config_sync', 'sync:' + dir]
};
grunt.config.set('watch', watch);
});
});
grunt.registerTask('syncall', ['config_sync', 'sync']);
grunt.registerTask('watchall', ['config_watch', 'watch']);
grunt.registerTask('default', ['watchall']);
};
This time, when watch find file changes, it can run the corresponding sync task. like this
grunt watchall
Running "config_watch" task
Running "watch" task
Waiting...
>> File "adon3/3.toc" changed.
Running "config_sync" task
Running "sync:adon3" (sync) task
Done, without errors.
Completed in 0.888s at Thu Apr 10 2014 14:01:26 GMT+0800 (CST) - Waiting...
Just installed latest Grunt on Ubuntu 12.04. Here is my gruntfile:
module.exports = function(grunt){
//project configuration
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
slides : {
src : ['src/top.html', 'src/bottom.html'],
dest : ['build/index.html']
}
}
});
//enable plugins
grunt.loadNpmTasks('grunt-contrib');
grunt.registerTask('default', ['concat:slides']);
}
This creates the build/ directory fine, but gives me the output of:
Running "concat:slides" (concat) task Warning: Unable to write
"build/index.html" file (Error code: undefined). Use --force to
continue.
I tried running chmod 777 on the directory, as I thought it might have something to do with permissions, but that didn't seem to change anything.
How can I make it so Grunt will write to build/index.html?
Figured it out:
//Does not work
dest : ['build/index.html']
Works as a string, but not an array:
//Works
dest : 'build/index.html'
I changed tasks/concat.js to accept arrays for dest:
// Write the destination file.
// If f.dest is an array take the first element
var dest = ([].concat(f.dest))[0]
grunt.file.write(dest, src);
but later I decided to use the files form instead of src/dest:
files: { 'dest.js': ['a.js', 'b.js'] }