#ask
Hello I want to ask,
Now I'm working on a college project, using laravel, when I enter the Blade Templating stage in Laravel ... I'm having trouble trying to move the .sass file to my Laravel project.
because previously when making the initial appearance of the website that I created, I used sass.
the question is, how do you get the .sass file to run in laravel?
#first-effort
previously I've searched on google and got the same question on stackoverflow... he suggested to install npm "npm install", then move all my css and sass files to resources/assets/sass after that run the command "npm run dev" , then it says all files will go to the app.css file
but after I try to run it, the result is still the same.
#my sass photo
https://imgur.com/a/xVNChUh
#Project display now when run
https://imgur.com/a/VQl242R (there is some styling because I made some styling in main.css, but the rest is in the sass file, so it looks messy like that)
#My Project display "should" (this is still running using html css on local)
https://imgur.com/a/Az8nx1W
Please help
Related
I just install new pwa onsen UI project for vue-cli using npm. All components working properly only icon components not showing icon while running app.
Even, I uncomment from v-ons-components file v-ons-icon
still its not working
I also wasn't seeing v-ons-icon components although everything else showed. The icons did show when in npm run dev but not after npm run build when opening the app from the built index.html file or running the app in the android emulator.
I got errors like GET file:///Users/[username]/[appname]/www/dist/static/css/static/fonts/fa-solid-900.132e975.ttf net::ERR_FILE_NOT_FOUND` and the file it was looking for would be in the place it was looking for, just without the "css" folder.
For example, the build would point to a www/dist/static/css/static/fonts/ folder for the font files, although it had placed those files in a www/dist/static/fonts folder. ... it was assuming a "css" folder to be there that wasn't there. The build process was somehow extracting the fonts reference into an additional "css" folder.
Since fonts were working in dev but not build, I compared webpack.dev.conf.js to webpack.prod.conf.js.
The webpack.prod.conf.js file contained extract: true inside of rules: utils.styleLoaders. This "extract" setting was not contained in the webpack.dev.conf.js file, so I deleted extract: true from webpack.prod.conf.js ... and then, when I ran npm run build again, the v-ons-icon components showed!
I'm trying to update my Bootstrap dependency in my Ember application to the alpha 4 version so I can access the utility classes (such as margin/padding).
I think Bootstrap is a bower dependency since it's listed in bower.json, so I followed the instructions from the new Bootstrap website:
bower install bootstrap#v4.0.0-alpha.3
When I did this, bower.json didn't update. In fact, Bootstrap version is still "bootstrap": "^3.3.7".
The only differences are:
Now I have 152 JSHint errors in my terminal...I tried adding "bootstrap":true to .jshintrc and restarted my server but the errors were still there.
My ember app was broken until I removed line 1 in change-version.js, which was #!/usr/bin/env node.
When I start typing a new css style in my templates, the CSS styles are showing up, but my Ember application is not recognizing them. For example, here is an image:
When I add the class m-r-3 and reload localhost, nothing shows up.
I've already tried importing bootstrap.min.css and bootstrap.css in the ember-cli-build.js file. It didn't work.
I have already read through this page which goes over dependencies but I have had no luck. If anyone could assist here that would be greatly appreciated.
You need to use --save parameter to save bower.json:
bower install --save bootstrap#v4.0.0-alpha.3
Look at the bower_components directory, does it keep the old version of the bootstrap? If so remove it.
You should add bootstrap.css to the ember-cli-build.js, as you said. Have a look at this addon, check your coding against of a typo or erronous adding.
Does your client loads any version of bootstrap? (Check vendor.js)
I am coding my portfolio WordPress website on top of the Reverie Foundation WP starter theme. When editing files (html / php / scss files), I am doing so in the Reverie child theme (although the Reverie master theme folder is in the same area as my child theme).
I've used both below (separately) in order to initiate the "watch" process:
compass watch
or
sass --watch scss:css
I have an issue. When editing the _settings.scss, (for example, changing the website width):
$row-width: rem-calc(1000); to $row-width: rem-calc(1140);
My command line says:
Changes detected to: scss/_settings.scss
write css/app.css
write css/style.css
But nothing changes (in this case, making the website container wider) on the front-end of my website.
This goes for any change whatsoever that I edit or make in _settings.scss.
The weird thing is, that if I'm in style.scss and add normal css styling or add SASS variables and minxins, it works and the changes show up! But when I edit _settings.scss, nothing changes!
Does anyone have any ideas as to why this is happenning? It would be much appreciated!
EDIT - I've tried clearing and deleting the hidden sass-cache folder, but that didn't work!
I'm also running this via localhost through Xampp.
when you use compass command you should run that commands on root project . where your config.rb is there . for example your path scss is :
d:/project/demo/scss/style.scss
if your config.rb in demo folder , at the first you go to demo folder with CMD , after that run compass command . attention your css folder pass must added in config.rb
diffrent beteween Compass watch and compass compile :
Compass watch steel working compiling your SCSS to CSS when you change SCSS files but when you enter compass compile that is compile just for ones .
I have tried both ways to compile a project using compass (i.e. via the gui app, and the command line.)
I get this error in both instances. "Nothing to compile. If you're trying to start a new project, you have left off the directory argument.
Run "compass -h" to get help."
Where do you add the directory argument?
I suspect the way to get this working is just switch to your directory for your project and then run
compass init
This will then create you a "working" config.rb, and a directory called sass, and a directory stylesheets
and a couple of start scss files.
If you do not want them, or want to use different directories, you can of course now edit your freshly created and working config.rb, and change your directories (and then delete the old automatically created ones)
Anyway having done that(or not) you should then be able to run
compass watch
and all should be good , i.e. your scss files get compiled to css files
Or then run your gui tool
More information to be found in the compass documentation here
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 3 years ago.
Improve this question
I'm currently using the Aptana plugin for Eclipse, which is giving me great syntax highlighting, and allows me to manually click to compile a *.scss file into a *.css file. What I would really like to be able to do is get it to automatically compile every time I save, but I cannot figure out how to do this.
I know you can use sass --watch on the command line, but I don't want to have to set this up manually every time I open eclipse, or create a new project.
Has anyone found a good way of achieving this? Is there must be a way of hooking into Aptana's Sass bundle and running it's compile command everytime I save? The accepted answer to this question suggests using a "Program Builder" - but is this really the best solution? If so does anyone have any tips/links to tutorials?
Update: I wrote up a blog post about how to use an ant script as a builder, but I'm still looking for a better way.
After lot of tries, I've found that the best solution in Eclipse is to define a simple Builder using the --update sass feature:
From the Project menu select "Properties" and choose the "Builders" section.
Create a new Builder and select "Program" as configuration type.
Choose a name for your launch configuration (SASS?!).
Insert the path of your sass installation into the Location field.
Use ${project_loc} as working directory.
In the Arguments text box insert the configuration parameters you want sass to use and, at the end, specify the --update parameter followed by your sass files directory source followed by ":" and the destination folder for the compiled css files. In my configuration "resources" is the source folder containing the .scss files and "web" is the destination directory containing the compiled .css files. The --update command will check for modifications in the source folder and all sub-folders. Screenshot
In the "Build Options" tab just check all options under the "Run the builder:" section. You can also "Specify working set of relevant resources" to launch the builder only when files contained in selected folders are saved. Screenshot
Click ok to save your launching configuration.
Now try to modify a .scss file in your source directory and then save it, you'll see the sass CLI output in your console window.
The sass CLI will automatically check for modified resources inside the source folder (resources in my configuration) and compile them into the destination folder (web in my configuration). Also, all .sass files that #import the modified resources will be compiled.
there is a watch switch for the sass comiler.
which rebuild the output (css) file everytime the source (scss,sass) change.
Quoting from : http://sass-lang.com/documentation/file.SASS_REFERENCE.html#using_sass
Using Sass
Sass can be used in three ways: as a command-line tool, as a
standalone Ruby module, and as a plugin for any Rack-enabled
framework, including Ruby on Rails and Merb. The first step for all of
these is to install the Sass gem:
gem install sass If you’re using Windows, you may need to install Ruby
first.
To run Sass from the command line, just use
sass input.scss output.css You can also tell Sass to watch the file
and update the CSS every time the Sass file changes:
sass --watch input.scss:output.css If you have a directory with many Sass files,
you can also tell Sass to watch the entire directory:
sass --watch app/sass:public/stylesheets Use sass --help for full
documentation.
Using Sass in Ruby code is very simple. After installing the Sass gem,
you can use it by running require "sass" and using Sass::Engine like
so:
engine = Sass::Engine.new("#main {background-color: #0000ff}", :syntax
=> :scss) engine.render #=> "#main { background-color: #0000ff; }\n"
There is much easier solution. Just follow the instructions to install SASS from:
http://sass-lang.com/install
and you will notice that first you will have to install Ruby. After that, just go to the folder where your SCSS/CSS files are located, start CMD and run this DOS command:
>cd <path-to-your-css-files>
>sass --watch .
Then all you need to do is to link your SCSS files to be recognized by Eclipse as native CSS files. Follow this solution:
https://stackoverflow.com/a/12322531/4180447
Hope this helps.
Note: I might have missed one or two steps. This is as per what I remembered after I completed the installation. If you face any problem, just post a comment, and I will try to help you.
Tarek