zoukankan      html  css  js  c++  java
  • VueJS如何引入css或者less文件的一些坑

    我们在做Vue+webpack的时,难免会引入各种公共css样式文件,那么我们改如何引入呢?引入时会有那些坑呢?

    首先,引入公共样式时,我们在“main.js”里使用AMD的方式引入,即

    require('./assets/stylus/index.styl');

    或者:import './assets/stylus/index.styl'

    这时,我们会抛出一个错误,是因为我们没有写解析的依赖,webpack不知道怎么解析

     
     

    这时,我们要填写上依赖,

    import '!style-loader!css-loader!stylus-loader!./assets/stylus/index.styl'

    就万事大吉了,也可以开始引入css文件了


    当然,在进行上面的步骤之前,需要先安装一下几个loader==>>

    npm install style-loader --save-dev

    npm install css-loader --save-dev

    npm install stylus-loader --save-dev

    同时在webpack.base.config.js ====>>>

     
     

    这时你就可以引入css文件了;


    另外附上几个示意图:

    1===》在main.js中引入外部css文件:

     
     

    2===》在APP.Vue里面引入外部css文件:

     
     

    小礼物走一走,来简书关注我



    作者:那年一纸花开
    链接:https://www.jianshu.com/p/66fdf2dfec9a
    來源:简书
    简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。
  • 相关阅读:
    BeautifulSoup_第一节
    第一个python爬虫——保存淘宝mm图片
    面试题:css(一)
    面试:HTML(二)
    websocket
    面试题:HTML篇(一)
    HTML5遗忘知识点(一)
    webpack热更新原理
    webpack按需加载
    什么是process.env?
  • 原文地址:https://www.cnblogs.com/h2zZhou/p/9796529.html
Copyright © 2011-2022 走看看