using less-loader in webpack - Stack Overflow

Webpack does not resolve less loader - Stack Overflow Home Public Questions Tags Users Companies Collectives ExploreCollectives Teams StackOverflowforTeams –Startcollaboratingandsharingorganizationalknowledge. CreateafreeTeam WhyTeams? Teams CreatefreeTeam Collectives™onStackOverflow Findcentralized,trustedcontentandcollaboratearoundthetechnologiesyouusemost. Learnmore Teams Q&Aforwork Connectandshareknowledgewithinasinglelocationthatisstructuredandeasytosearch. Learnmore usingless-loaderinwebpack AskQuestion Asked 4yearsago Modified 1year,3monthsago Viewed 19ktimes 2 Iamcreatingabundle.jsfilewithwebpack.IhavedecidedIwanttostartusingLESSaswellandIhavetriedtoaddtheless-loaderaspertheinstructions: https://github.com/webpack-contrib/less-loader Iran: npm-installless-loader--save-dev ThenIupdatedthewebpack.config.jstoincludetherules: module.exports={ entry:"./src/entry.js", output:{ path:__dirname, filename:"./bundle.js", publicPath:"/" }, module:{ //********BELOWISTHERULESUADDED*************/ rules:[{ test:/\.less$/, use:[{ loader:'style-loader'//createsstylenodesfromJSstrings },{ loader:'css-loader'//translatesCSSintoCommonJS },{ loader:'less-loader'//compilesLesstoCSS }] }], //********ABOVEISTHERULESUADDED*************/ rules:[ { test:/\.js$/, loader:'babel-loader', query:{ presets:['es2015'] } } ], rules:[ { test:/\.css$/, use:[ {loader:"style-loader"}, {loader:"css-loader"} ] }, { test:/\.(html)$/, use:{ loader:'html-loader', options:{ attrs:[':data-src'] } } } ] }, devServer:{ stats:'errors-only' }, stats:{ colors:true }, devtool:'source-map' }; ThenIaddedalessfileandrequireditlikeso: require("./Bootstrap/bootstrap-iso.less"); thelessfileisjustawrapperforbootstrap(Ihavealsotriedsimpliercss) #entry{ @import(less)'./css/bootstrap.css'; } ButIcontinuetogetthefollowingerror: ERRORin./src/Bootstrap/bootstrap-iso.less Moduleparsefailed:Unexpectedcharacter'#'(1:0) Youmayneedanappropriateloadertohandlethisfiletype. |#entry{ |@import(less)'./css/bootstrap.css'; |} @./src/entry.js13:0-41 itseemsthattheloaderisnotloadedproperly? webpacklessless-loader Share Improvethisquestion Follow askedMay12,2018at5:08 MichaelMichael 7,5171717goldbadges5656silverbadges106106bronzebadges Addacomment  |  1Answer 1 Sortedby: Resettodefault Highestscore(default) Datemodified(newestfirst) Datecreated(oldestfirst) 6 Itwasmymistakes,Ishouldnothavehadmultiplerulesproperties..seeworkingwebpack.config.jssnippet: module:{ rules:[{ test:/\.(less)$/, use:[{ loader:'style-loader'//createsstylenodesfromJSstrings },{ loader:'css-loader'//translatesCSSintoCommonJS },{ loader:'less-loader'//compilesLesstoCSS }] }, { test:/\.js$/, loader:'babel-loader', query:{ presets:['es2015'] } }, { test:/\.css$/, use:[ {loader:"style-loader"}, {loader:"css-loader"} ] }, { test:/\.(html)$/, use:{ loader:'html-loader', options:{ attrs:[':data-src'] } } } ] } Share Improvethisanswer Follow editedMar2,2021at10:21 FarrukhNormuradov 90011goldbadge99silverbadges2828bronzebadges answeredMay12,2018at5:36 MichaelMichael 7,5171717goldbadges5656silverbadges106106bronzebadges Addacomment  |  YourAnswer ThanksforcontributingananswertoStackOverflow!Pleasebesuretoanswerthequestion.Providedetailsandshareyourresearch!Butavoid…Askingforhelp,clarification,orrespondingtootheranswers.Makingstatementsbasedonopinion;backthemupwithreferencesorpersonalexperience.Tolearnmore,seeourtipsonwritinggreatanswers. Draftsaved Draftdiscarded Signuporlogin SignupusingGoogle SignupusingFacebook SignupusingEmailandPassword Submit Postasaguest Name Email Required,butnevershown PostYourAnswer Discard Byclicking“PostYourAnswer”,youagreetoourtermsofservice,privacypolicyandcookiepolicy Nottheansweryou'relookingfor?Browseotherquestionstaggedwebpacklessless-loaderoraskyourownquestion. TheOverflowBlog Remoteworkiskillingbigoffices.Citiesmustchangetosurvive Onthequantuminternet,datadoesn’tstream;itteleports FeaturedonMeta AnnouncingthearrivalofValuedAssociate#1214:Dalmarus Improvementstositestatusandincidentcommunication CollectivesUpdate:IntroducingBulletins The[comma]tagisbeingburninated AskWizardTestResultsandNextSteps Related 152 Invalidconfigurationobject.WebpackhasbeeninitialisedusingaconfigurationobjectthatdoesnotmatchtheAPIschema 2 HowtofixHTMLfilecommentsnotbeingignoredbyWebpackDevServer? 1 Webpackproductionbuildfails:"Can'tresolve'aws-sdk'" 1 Integratewebpackwithbootstrapandless-loader 3 Webpack-differentfontpathforbuildandproductioncssintheless-loader HotNetworkQuestions CoefficientsreturnedfromCoefficientRules Whatisthepurposeofa"monitordiode",insidealaserdiodecase? Howtocopy/pastebetweenaconsoleandanXsession? Aretheremodernlanguageswithoutstandardizedspelling?Ifnot,why? howtocombineverticesintoasurface NumberofLaurentmonomialsofnvariableswithdegreeatmostd Ifeelmorecomfortableworkingfromanoffice.Isthisnowa'drawback'? Whenwesayarigidbodyisasystemofparticles,whatexactlyare'particles'here? CanIcheckinattheairportwithoutavisaasIintendtogetVisaonArrivalatmydestination? In7WondersDuel:Pantheon,the"Ra"DivinitycardletsyoustealoneWonderfromanopponent;doyouchoose,orisitrandom? DidtheSovietUnionprotestagainstItalybuildingoracquiringsubmarinesafterWW2? InnersillcorrosionimplicationsinRover452003 WillIbebarredfromtravelingtotheUSinthefuture,afteratenseimmigrationinterrogation? DoestheIssurofZeraLevatlastillapplytoainfertileperson I'mlookingforamangathathasagamedeveloperasthemaincharacter Mathematically,whatishappeningdifferentlyintheneuralnetduringexplorationvs.exploitation? PhotoCompetition2022-06-06:Reflections Howtounderstand'conspire'inthissentence? Anargumentthateverythingexists WillmyMangoseedlingsurviveafterbeingattackedbymystupidcat? Measurethetotalruntimeofafunctioninaproject Whatwasthe"highCommissionerofthePoliceinScotland"in1777? HowcanIfindoutthenumberofteethoneachcogforcassettesandchainrings? Whywasthe6502versionofMicrosoftBASICcodedlikethe8080and6800versionseventhoughthiswasratherinefficient? morehotquestions Questionfeed SubscribetoRSS Questionfeed TosubscribetothisRSSfeed,copyandpastethisURLintoyourRSSreader. Yourprivacy Byclicking“Acceptallcookies”,youagreeStackExchangecanstorecookiesonyourdeviceanddiscloseinformationinaccordancewithourCookiePolicy. Acceptallcookies Customizesettings