Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I'm a little lost as to how I should proceed, actually I don't even know where to start.
I've been working on a few wordpress sites lately, usually I create a dev environment using npm grunt.
I set up a folder and do npm init. Then I install all the grunt plugins I need such as: watch, sass, uglify etc... I then download wordpress and set up the gruntfile.js so that for example my sass will compile to my wordpress theme's stylesheet. Just the usual (I hope).
The thing is rather than always repeating the same step over and over I'd like to automate it ( same config step for each site ).
So here is my question, how do you go about creating a script that will automaticaly install grunt plugins and configure them, download the latest wordpress and set up the theme files ( domain name etc...)?
I don't need an explanation on how to do all these steps but just a few pointers on where to start and what tools to use would be great. Being quite the novice in script writing any information is good to use.
Try yeoman.
There is yeoman generator for wordperss boilerplate. It uses gulp instead grunt, but has same idea that you need.
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I want to extend the npm run build command in my package.json not by replacing it, because it uses react-scripts build but by &&'ing another script.
Fastest way to achieve this would be a bash script which just does that. I want to copy a few other files from src into build in order to make a chrome extension out of it.
Is it considered bad practice to use a shell script here rather than writing it natively in a node environment?
Not exactly a bad practice and it is often done in practice but keep in mind that it will be less portable because it will not work on systems where the shell that you use for scripting (e.g. Bash or whatever is in the shebang line) is not available.
I recently wrote an answer to the question on how to solve a problem with installing Node modules that require Bash on Windows:
'bash' is not recognized as an internal or external command
So it is a problem that happens in practice.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I`m trying to make my project runs in a test server, but when I run the ng build command and take the data from dist to there it always tries to load the js and css files from myserver.com/ and not from myserver.com/folder-of-project/
I thought it would be a problem on my code, but I created an empty project with angular-cli and did the build directly and also I got the same problem.
Am I missing something to do in the code before preparing the build?
Run ng build --env=prod this will build your project for production. ng-build it for local development. Also make sure inside your index.html the base href is as follows: <base href="/">
As mentioned in the comments, you'll need to append your project folder to your base href inside your index.html file
like so
<base href="/folder-of-project">
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 6 years ago.
Improve this question
You write libraries using ES6/7, so someone importing the source would have to use Webpack + Babel to transpile the code.
You can get around that problem by providing the transpiled bundle. But then the problem is you would bundle in your dependencies, which the user may also have. Then the dependency gets bundled in redundantly for the user.
You want to preserve the
import MyLib from 'my-lib'
syntax so you don't want to provide two import paths.
What do you do?
You should just bundle your library. Even if the user happens to use the same dependencies that you use, most likely they will be using a different version, which might not work with your library.
If you want to reduce the size of your bundle, you should use Rollup.js—it uses tree-shaking, which basically means that your bundle will include only the parts of the code that you actually need.
After digging around, I found an excellent example:
https://github.com/reactjs/redux
Redux uses package.json prepublish to transpile the source code, without bundling it. This works perfectly as it no longer requires the user of the library to use babel, and at the same time does not bundle in dependencies.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
so i completed building a new angular application and i would like to deploy it into production... of course i have prepared all my angular code such that it can be minified so i am covered there!! But something i dont understand... i have very good code separation and full unit testing of my application... as a result, of course, there are a lot of script tags on my main page.
I need to of course debug my javascript during runtime as i develop, but then when i go to deploy i need to minify. What is the best practice here? Is this literally a manually process of replacing the script tags with my all.min.js file after i move the code to the production machine? Do i minify all the css and html as well?? I am using gulp for the minification...
thanks for the help....
In the absence of server side templating (like Razor or Thymeleaf) I would suggest using gulp-preprocess, gulp-processhtml, or gulp-html-replace.
Use gulp to concat your files in development as well as production. You'll probably want to use gulp-sourcemaps to be able to debug your client-side javascript as if they were separate files.
Here's a sample gulpfile.js
gulp.task('script', function(){
gulp.src('./app/**/*.js')
.pipe(sourcemaps.init())
.pipe(concat('application.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest('./build'))
})
gulp.task('script:prod', function(){
gulp.src('./app/**/*.js')
.pipe(concat('application.js'))
.pipe(ugilfy())
.pipe(gulp.dest('./build'))
})
Then in your view, just point it at the build file.
<script src="/build/application.js"></script>
When you deploy, run gulp script:prod. In development, run gulp script.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
Improve this question
I have many CSS & JS files. Ideally, I just want to use some command line tool to select all those css & js files, and minify them into one file each. Any simple tools for this?
The npm respository offers many command line tools for this, for example:
https://www.npmjs.com/package/uglify-js
https://www.npmjs.com/package/uglifycss
Just install them with "npm install -g [package-name]", after installing Node.js - which comes with npm.
You're looking for yuicompressor? It minifies and combines multiple CSS files (or JS files) and concatenates them to one single file.
Example:
yuicompressor *.js > javascript.min.js
You can use gulp to do this.
Take a look at this tutorial for some simple examples, including css and js minification :
http://julienrenaux.fr/2014/05/25/introduction-to-gulp-js-with-practical-examples/
Of note is the js example, which demonstrates minifiying an entire directory - you can do the same with css as well.
You will have to create one small config file unless you use the gulp-shell node package. I probably wouldn't bother with that when first learning gulp.
There are a few "set up gulp" tutorials, including this one: http://travismaynard.com/writing/getting-started-with-gulp.
A build tool like gulp or grunt are made to do this, plus you can do a lot more once you're familiar with one of them.