element-ui+less+jq在Vue里面的安装配置

一,element-ui的安装使用

1. 先用vue搭建环境之后,在安装 element-ui

npm install element-ui --save

2. 在 main.js(也就是主入口) 中写入

import ElementUI from 'element-ui'

import 'element-ui/lib/theme-chalk/index.css'

Vue.use(ElementUI) 这时候你就可以在页面里面使用element-ui组件的代码了。

二,less的安装使用


1- 安装 less 和 less-loader

npm install less less-loader --save-dev

2- 安装成功后

打开 build/webpack.base.conf.js ,在 module.exports = 的对象的 module.rules 后面添加一段:

{

        test: /\.less$/, 

        loader: "style-loader!css-loader!less-loader", 

}

3- 在代码中的 style 标签中 加上 lang="less" 属性即可(防止样式冲突)


三,jq的安装使用


4,首先在package.json里的dependencies加入"jquery" : "^2.2.3"


然后npm install

2- 在webpack.base.conf.js里加入


 var webpack = require("webpack")


3- 然后在module.exports方法里面加入


plugins: [

    new webpack.optimize.CommonsChunkPlugin('common.js'),

    new webpack.ProvidePlugin({

        jQuery: "jquery",

        $: "jquery"

    })

]

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容