鍍金池/ 問答/HTML5  HTML/ webpack在less的文件中使用resovle

webpack在less的文件中使用resovle

1、在less文件中像js文件一樣，引用短路徑。
2、webpack.config.js如下

  resolve: {
    extensions: ['.js','.json'],
    alias:{
      src:path.resolve(__dirname,'src'),
      components:'src/components',
      routes:'src/routes',
      common:'src/common'
    }
  },

3、js文件中可以直接使用import 'components/Header.js'引用，但是less中無法使用@import 'common/consts.less'

回答
編輯回答
夏木

//可通過CommonJS規(guī)范導(dǎo)入LESS模塊
require('./common/consts.less');
既然使用了webpack,那就直接在js文件中引入就可以了，記得安裝對應(yīng)的loader

2018年3月17日 21:29
編輯回答
魚梓

這個因為@import是由css-loader來解析的
第一種方法@import ‘~@scss/icon.less‘;，
css 引入 中： @import "~@/style/theme"
css 屬性中： background: url("~@/assets/xxx.jpg")
html 標(biāo)簽中： <img src="~@/assets/xxx.jpg" alt="alias">

2017年2月1日 03:45