I use a starter for Mithril.js that run well (starter on github). To run the app, I write in the CLI: "npm start".
After adding to my project Firebase, the app needs localserver. I tryed many other starters and all failed in a second run or in first run.
I try to use local-web-server in webpack (package.json) in the following way:
"start": "webpack -d --watch ws --spa public/index.html",
but it gives error.
How can I add to the starter web-server?
try installing
npm install webpack-dev-server --save-dev
add this setting to webpack.config.js
devServer: {
contentBase: path.join(__dirname, "dist"),
compress: true,
port: 9000
}
and contentBase add your file path
Related
I added a the heroku/nodejs buildpack to my Symfony heroku app, and I am able to install my yarn dependencies.
However I am not able to run
$ yarn run encore production
I always have the same error Command "encore" not found whether I run the command in composer.json :
// composer.json
"compile": [
"node_modules/.bin/encore production",
[•••]
or in package.json
//package.json
"scripts": {
"heroku-postbuild" : "yarn run encore production"
[•••]
In your package.json root file :
"scripts": {
...
"heroku-postbuild" : "node_modules/.bin/encore production"
}
It will run your webpack encore and running your others npm modules.
To anyone coming here, you'll first need to add the node buildpack to your app, as per this question.
Make sure to add the node buildpack before the php one.
Then, add "node_modules/.bin/encore production" to your compile (as shown in the question).
Finally, as written in comment, don't forget to change webpack dependencies from devDependencies to dependencies in your package.json.
I always run Encore commands as cd my-project/ && ./node_modules/.bin/encore ... Would that work for you?
I have the current version of npm installed and things seem to be OK:
The autoprefixer loads up just fine :
I created a file 'Grunfile.js'in the local project folder:
I am running this on windows 8.1
Where to from here? How do I tell grunt to check the file? How do I call the function from the command line ? Or do I call the function from the command line?
Within your directory you'll need to have 2 files, the package.json and the Gruntfile.js. To create a package.json file run the command npm init.
Next, you need to add the grunt-autoprefixer task to your package.json file which you can do by running npm install grunt-autoprefixer --save-dev.
Then, within the Gruntfile.js it should look something like this:
module.exports = function(grunt) {
grunt.initConfig({
autoprefixer: {
options: {
// Task-specific options go here.
},
your_target: {
// Target-specific file lists and/or options go here.
},
},
});
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.registerTask('default', [
'autoprefixer'
]);
};
For more details on editing the settings on autoprefixer check out the documentation: https://github.com/nDmitry/grunt-autoprefixer
To learn more about Grunt check out https://learngrunt.com
I made a folder g in root(C:/) in where I try to install Grunt via npm.
I sucessfull made: npm install -g grunt-cli.
I configured package.json to this:
{
"name": "testing",
"version": "0.0.0",
"dependencies": {
"grunt": "~0.4.5" },
"description": "testing",
"main": "index.html",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"grunt": "^0.4.5"
}
}
So good so far.
BUT: When I try to install Grunt: npm install grunt --save-dev and modules(plugins) then I run into this error: npm WARN package.json testing#0.0.0 No repository field...
I use GitHub where I've forked Grunt and Grunticon.
Then I can't succed with nothing towards installing Grunt...
Any good clues and help in solving this?
Okay, I think I see the problem clearly now. Here are some instructions for getting Grunt running, try to follow these exactly, do not create any other folders as it could cause issues for Grunt or Node.
Create a folder for your project, this can be anywhere on your system.
Save the file you have above as package.json in that folder.
Now install the global Grunt CLI
~$ npm install -g grunt-cli <-- Note this is "grunt-cli" NOT "grunt"
Then go to the new directory you created and run this command:
~/new-directoty$ npm install
This will install the Grunt runtime locally for your project because it is specified in package.json
Create a very simple config file in the new directory and name it Gruntfile.js:
module.exports = function(grunt) {
grunt.initConfig({ /* your config will go in here */ });
/* multi-task definitions go here */
};
Now try to run Grunt just to test that it works:
~/new-directory$ grunt
After that you are ready to start adding plugins, but that's a bigger topic. Good luck.
I used the following as pre-build event in Visual Studio 2013 to compile Bootstrap 3.0 with recess according to this answer and it worked
recess "$(ProjectDir)Content\bootstrap\bootstrap.less" --compress > "$(ProjectDir)Content\bootstrap-compiled.css"
Now this doesn't work for Bootstrap 3.1.1 and they say Grunt will do it. I've tried:
grunt-contrib-less "$(ProjectDir)Content\bootstrap\bootstrap.less" --compress > "$(ProjectDir)Content\bootstrap-compiled.css"
But can't get it to work. Any ideas how to get Grunt to work with VS 2013.
Note: I've Installed Node.js and recess earlier, then > npm install grunt-contrib-less then to be sure >npm update grunt-contrib-less.
I've got this working in a slightly different way:
Ensure you've got grunt-cli installed globally (npm install -g grunt-cli)
Create a Gruntfile.js in your project or solution, and define a target to do whatever less compiling you want (e.g. less)
Add call grunt less to your pre-build event (if you don't specify CALL, then the process doesn't return after grunt)
You can add different targets to the development and production build processes if you like. You can also set up more targets for other tasks - I have one so I can run grunt watch to automatically recompile my CSS if I edit less files.
Step-by-step guide to converting the VS2013 sample project to use less and Grunt:
Remove bootstrap and install bootstrap less:
Uninstall-Package bootstrap
Install-Package Twitter.Bootstrap.less
Open a command prompt and cd to your project directory
Ensure grunt-cli is installed globally:
npm install -g grunt-cli
Create a package.json file:
npm init
Install grunt and grunt-contrib-less locally:
npm install grunt grunt-contrib-less`
Create a file in your project called Gruntfile.js with the following contents:
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
less: {
dev: {
options: {
sourceMap: true,
dumpLineNumbers: 'comments',
relativeUrls: true
},
files: {
'Content/bootstrap.debug.css': 'Content/bootstrap/bootstrap.less',
}
},
production: {
options: {
cleancss: true,
compress: true,
relativeUrls: true
},
files: {
'Content/bootstrap.css': 'Content/bootstrap/bootstrap.less',
}
}
},
});
grunt.loadNpmTasks('grunt-contrib-less');
// Default task(s).
grunt.registerTask('default', ['less']);
grunt.registerTask('production', ['less:production']);
grunt.registerTask('dev', ['less:dev']);
};
Edit your Visual Studio pre-build event to include:
cd $(ProjectDir)
call grunt --no-color
(--no-color removes some of the control characters from the Visual Studio build output)
Build your project, then enable show all files, and incldue the two compiled css files in your project (so that web deploy picks them up).
I have installed Grunt like so `npm install -g grunt-cli successfully.
I have also installed the grunt-contrib-concat libary succesfully like so: npm install grunt-contrib-concat --save-dev
I have created a package.json:
{
"name": "my-project-name",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-jshint": "~0.1.1",
"grunt-contrib-nodeunit": "~0.1.2"
}
}
and a Gruntfile.js:
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
options: {
separator: ';'
},
dist: {
src: ['src/init.js', 'src/Game.js', 'ui/Ui.js', 'ui/AddBTS.js', 'ui/Toolbar.js'],
dest: 'built.js'
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
};
Now when I run grunt concat I get the following error:
Fatal error: Unable to find local grunt.
If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide:
This is my first time using Grunt and I've been trying to solve this problem for over 2 hours now. Please could someone help me and advise what I've not set up correctly.
Thanks in advance!
It's likely that Grunt is not installed locally in your project folder (which is different than grunt-cli). You have it in your package.json so try doing npm install or alternately npm install grunt.
For more information see the getting started page:
Note that installing grunt-cli does not install the grunt task runner! The job of the grunt CLI is simple: run the version of grunt which has been installed next to a Gruntfile. This allows multiple versions of grunt to be installed on the same machine simultaneously.