vue 引入iview3.x使用less更换主题的过程报错解决

说明：换肤报错 Inline JavaScript is not enabled. Is it set in your options?

解决方案如下：

1、按照iview官方的文档定制主题,webpack编译时会有个坑，下面简述一下主要过程

npm install iview –save 
npm install less –save 
npm install less-loader –save

2、修改util.js中的less配置，

return {
    css: generateLoaders(),
    postcss: generateLoaders(),
    less: generateLoaders('less'),
    sass: generateLoaders('sass', { indentedSyntax: true }),
    scss: generateLoaders('sass'),
    stylus: generateLoaders('stylus'),
    styl: generateLoaders('stylus')
  }

为

return {
    css: generateLoaders(),
    postcss: generateLoaders(),
    less: generateLoaders('less',{ javascriptEnabled: true }),
    sass: generateLoaders('sass', { indentedSyntax: true }),
    scss: generateLoaders('sass'),
    stylus: generateLoaders('stylus'),
    styl: generateLoaders('stylus')
  }

3、在src下新建theme/index.less

@import '~iview/src/styles/index.less';

// Here are the variables to cover, such as:

@primary-color: #8c0776;

 

6,在main.js中引入自定义的less文件即可

import Vue from 'vue';

import iView from 'iview';

import '../my-theme/index.less'; Vue.use(iView);

原文：https://blog.youkuaiyun.com/jyixie/article/details/81915963