Question

这是我的用例：大多数svgs都应该内联。所以我设置了这样的规则：

{test: /\.svg$/, use: "svg-inline-loader"},

在某些情况下，我只想要一个svg的url而不是内联它。在webpack 1.x中，我要求他们这样：require('path/to/file.svg?external')。

这里有相应的规则：

{test: /\.svg\?external$/, use: "file-loader!image-webpack-loader"},

在?进行规则时，似乎webpack 2不再包含test部分，因为迁移后只有第一条规则被应用于 all 我的svgs

有解决方法吗？在require使用相同扩展名的文件时，是否有不同的策略可以应用不同的加载器集？

PS：我知道我可以要求这样的文件：require('!file-loader!image-webpack-loader!path/to/file.svg')但是我的加载器比这更复杂，我不想一直重复它们的配置

PSS：这似乎不起作用（它仍然只适用第一条规则）

{test: /\.svg$/, use: "svg-inline-loader", exclude: /\?external/},
{test: /\.svg$/, use: "file-loader?!image-webpack-loader", include: /\?external/}

Answer 1

所以我最近参加了webpack的JuhoVepsäläinen的演讲，并在this slide找到答案：

def onchange_sub_nominee(self, cr, uid,ids,employee_id,date_to, date_from,sub_nominee,half_day,half_day_status):
    #Employees data
    DATETIME_FORMAT = "%Y-%m-%d %H:%M:%S"
    from_dt = datetime.datetime.strptime(date_from, DATETIME_FORMAT).date()
    to_dt=datetime.datetime.strptime(date_to, DATETIME_FORMAT).date()

    sub_name=self.pool.get('hr.employee').browse(cr, uid, sub_nominee).name

    hol_obj=self.pool.get('hr.holidays')

    if employee_id==sub_nominee:
        raise osv.except_osv(_('Warning!'),_('Leave Denied: You can not be substitute to yourself '))

    #if date_from==date_to:
    hol_objs=hol_obj.search(cr, uid, [('employee_id','=',sub_nominee),('type','=','remove'),('state','not in',['draft','refuse'])])
    #nominees data
    if hol_objs:
        for a in hol_obj.browse(cr, uid, hol_objs):
                    sub_from_dt = a.date_to                                            
                    sub_to_dt=a.date_from
                    no_days=a.number_of_days_temp
                    sub_half_day=a.half_day
                    sub_half_day_sts=a.half_day_status

                    f_dt = datetime.datetime.strptime(sub_from_dt, DATETIME_FORMAT).date()
                    t_dt=datetime.datetime.strptime(sub_to_dt, DATETIME_FORMAT).date()

                    if ((from_dt==to_dt)and(to_dt==f_dt==t_dt)and (half_day != True)):

                         raise osv.except_osv(_('Warning!'),_(' %s already on leave on %s . Please nominate another person ')%(sub_name,from_dt))

                    if ((from_dt==to_dt)and(to_dt==f_dt==t_dt)and (half_day == True) and (half_day_status==sub_half_day_sts) ):
                            raise osv.except_osv(_('Warning!'),_(' %s already on leave on %s , %s. Please nominate another person ')%(sub_name,from_dt,sub_half_day_sts))

                    if ((from_dt!=to_dt)) and(no_days<=2): 

                        while from_dt <= to_dt :                         
                              new_con=self.search(cr, uid, [('date_from', '<=', date_to), ('date_to', '>=', date_from), ('employee_id', '=', sub_nominee)])
                              if new_con:
                                  raise osv.except_osv(_('Warning!'),_(' %s has/have already on leave(s) on that period  . Please nominate another person')%(sub_name))
                              from_dt = from_dt + datetime.timedelta(days=1)

                    if ((f_dt!=t_dt)):                                                         
                        while t_dt <= f_dt:                                
                            if (from_dt==t_dt)or(to_dt==t_dt):
                                raise osv.except_osv(_('Warning!'),_(' %s has/have already on leave(s) on that period  . Please nominate another person')%(sub_name))

                            t_dt=t_dt+datetime.timedelta(days=1)

    return True

resourceQuery救援！

Answer 2

resolveLoader.alias将成为您的解决方案。

您的配置如下所示：

resolveLoader: {
  alias: {
    myLoader1: "svg-inline-loader", // and much more
    myLoader2: "file-loader!image-webpack-loader" // and much more
  }
}

和用法：

require('myLoader1!path/to/file1.svg');
require('myLoader2!path/to/file2.svg');

或者，如果您希望myLoader1配置为默认配置，并且不时使用myLoader2加载器使用此类配置：

{
  test: /\.svg$/,
  use: "svg-inline-loader" // and much more
}

// ...

resolveLoader: {
  alias: {
    myLoader: "file-loader!image-webpack-loader" // and much more
  }
}

并使用如下：

require('path/to/file1.svg'); // default svg-inline-loader
require('!myLoader!path/to/file2.svg'); // specific file-loader!image-webpack-loader
// ! at the beginning - disables loaders from default
// and myLoader enables file-loader and image-webpack-loader

PS。我对webpack 1有类似问题here，但文档说resolveLoader.alias的工作方式相同。

Answer 3

除了test之外，您还可以指定include / exclude条件。来自docs on configuration options：

{
    test: /\.jsx?$/,
    include: [
      path.resolve(__dirname, "app")
    ],
    exclude: [
      path.resolve(__dirname, "app/demo-files")
    ]
    // these are matching conditions, each accepting a regular expression or string
    // test and include have the same behavior, both must be matched
    // exclude must not be matched (takes preferrence over test and include)
    // Best practices:
    // - Use RegExp only in test and for filename matching
    // - Use arrays of absolute paths in include and exclude
    // - Try to avoid exclude and prefer include
}

Webpack 2+：如何为具有相同扩展名的文件应用不同的加载器？

3 个答案: