1-vue中使用sass /elementUI的配置的方法

1、创建基于webpack模块的项目

    vue init webpack projectName

2、安装相关依赖

    cd projectName

    npm install 

3、安装Sass

    npm install --save-dev sass-loader

    npm install --save-dev node-sass

    // sass-loader 依赖于 node-sass

4、build 下webpack.base.conf.js 的rules中添加配置 

{  

    test: /\.sass$/, 

    loaders: ["style", "css", "sass"]    

}

5、若要全局引入scss文件 先安装sass-resources-loader

    npm install --save-dev sass-resources-loader

然后在build/utils.js 中修改 return { scss:generateLoaders('sass') }为

scss:generateLoaders('sass').concat( {

    loader:'sass-resources-loader',

    options:{

        resources:path.resolve(__dirname,'../src/文件地址') 

     } 

 })

6、安装elementUI

    npm i element-ui -S

7、在main.js中添加配置

    import ElementUI from "element-ui";

    import "element-ui/lib/theme-chalk/index.css";

    Vue.use(ElementUI);

你可能感兴趣的:(1-vue中使用sass /elementUI的配置的方法)