I've installed Bootstrap 4 Instant Theme on my dev machine, which has DNN installed. I can get the theme up OK.
I've installed Node.js and that looks OK.
I've run npm ci in the app/theme folder, and that seems to have run OK. There is a webpack.config.js file in the folder.
I don't get the "run webpack" instruction!
When I make changes to the _variables.scss file and save and then refresh my page, I don't get the theme updates.
The Client Resource Management was already disabled.
I've cleared the cache and restarted the application.
What am I missing, or what is missing from the documentation that it assumes I know?
Just to be sure: did you compile the scss? As Bootstrap 4 uses SASS, the scss need to be compiled in order to take effect.
Try
npx webpack --config webpack.config.js
cmd is enough to run the command. I use a .bat with this to quick compile.
run npm run webpack from commandline.
I have extended the instructions and explained the step better. I hope you were able to move on by now.
João Gomes, thx for your quick answer =)
Related
i am learning tailwind css and in tutorial they write a command like this npx tailwindcss-cli build css/tailwind.css -o build/tailwind.css
and it build a different folder name "tailwind.css" in same directory
but in my case it gives a error
No valid exports main found for 'C:\Users\HHH\AppData\Roaming\npm-cache\_npx\4952\node_modules\tailwindcss-cli\node_modules\postcss'
I don't have any idea what it means and whats wrong with the setup.
please help.
I find the solution.
Just install the current node.js and reinstall the specific version.
download here
After that install it and everything works fine.
Note: It works in when you follow the tailwindcss cli method.
follow first part of video
I would like to use gulp in my Wordpress project. Is it possible to execute gulp functions outside a node JS project?
I'm running on OSx, but couldn't find anything on the internet about it. Or do I'll have to use another lib like Grunt?
Yes, the main language of your project doesn't affect whether or not your can include some node.js dependencies and run them. You will need to have gulp installed and have a gulpfile.js in your project, and then you can run it.
You could install gulp globally on the server (npm install -g gulp), but I recommend creating a package.json file (using npm init) in your project, so that your node.js dependencies are tracked in your version control, and installing gulp with npm install --save gulp (inside your project's directory). Since gulp won't be installed globally in that case, you will need to use "$(npm bin)"/gulp from a directory inside your project to run it.
I use Yeti Launch from the Zurb foundation for the same setup (no node installed on my Mac).
When you run it, it will create a Foundation frame but you can do the following:
Stop the project it creates from within its interface,
Delete the files it creates and replace with yours
Leave the project it shows in the interface
Leave the "node_modules" folder it creates
Start the project again
This will run your Gulp file.
The only issue is installing node modules. For this, I look at any error messages it gives regarding missing modules and copy these into the "node_modules" folder from Github
The short answer is no. Gulp is distributed as a npm package and has node.js as a dependency BUT that doesn't mean you can't use it outside of a node.js project.
The only real need for Gulp on a wordpress project would likely either be at the theming layer or if you were doing a custom plugin. Assuming you are making a theme, some of them use Gulp extensively.
I've used the Roots ecosystem's Sage theme successfully on a number of projects. It has node/npm dependencies but they are all included if you use the theme. Check out their Gulp file - it's probably close to what you are philosophically looking for.
I have installed WebStorm 9 on Mac. I am having problems getting my LESS code compiled to CSS even after installing the LESS Compiler plugin.
The following message gets displayed:
"Missing CSS Output Directory - You can add CSS output directories under Settings > Project Settings > LESS Compiler"
Though there is no "Project Settings", I have add out put directory to LESS Compiler in "Settings".
It still does not work.
Known issue - see https://github.com/acdvorak/intellij-lessc-plugin/issues/47.
I can suggest using less compiler (npm install -g less) configured as a file watcher instread - see https://www.jetbrains.com/webstorm/help/transpiling-sass-less-and-scss-to-css.html
I also meet the problem in mac WebStorm, finally found where is wrong:
WebStorm Less compiler only work for ver. less 1.6.2
please use below under your project:
sudo npm install less#1.6.2
then in File Watchers in WebStorm to edit Less watcher,
in Program field change path to:
yourProjectPath/node_modules/less/bin/lessc
then happy css will appear. :)
These are my settings. Here is the error i am facing while compiling .less file.
Step 1: Install npm less module
npm install -g less
Step 2: Install the less plugins in Intellij Idea
File > Settings > Plugins
Step 3: Setup Less Profile
File > Settings > LESS Profiles
It'll auto-generate the CSS file as soon as any change is noticed in LESS if "Compile Automatically on Save" is used.
You are incorrectly looking in Project Strucutre.
The Project Settings is the icon to the left (spanner).
I'm pretty new to whole Grunt and SCSS workflow stuff and recently configured Grunt with a WP theme development that run under MAMP. Installation of Node, NPM, Grunt and its dependencies went smooth. However, when i make a change on .SCSS files, it doesn't seem to be reflecting the changes to the .CSS files due to following warning from compass:
Running "compass:app" (compass) task
LoadError on line ["55"] of /Library/Ruby/Site/2.0.0/rubygems/core_ext/kernel_require.rb: cannot load such file -- susy
Run with --trace to see the full backtrace
Warning: ↑ Use --force to continue.
Aborted due to warnings.
Not exactly sure what's up but obviously a communication issue between Ruby and Compass?
Whether it be incorrect version mapping or paths..?
I researched and attempted following:
Uninstalled the current and installed new Ruby
Installed RVM (didn't use it, just installed it)
Upgraded compass to the latest version 0.12.2 and made sure this version is reflected in package.json for grunt.
Any pointers and advise highly appreciated!
I don't know if this is an option but you might look at PrePros (https://github.com/sbspk/Prepros). I tried for a while to setup the raw/core setup you are working with but it was just always quirky - not to mention super tedious to setup. PrePros takes all the pain away! Just a suggestion.
Related/Reference link: https://stackoverflow.com/questions/19866550/sass-haml-compile-on-prepros