下面是一个引用jq插件的demo示例:
关于css的部分
在vue-cli中使用sass、less来编写css样式,步骤十分简洁,因为vue-cli已经配置好了sass、less,我们要使用sass或者less直接下载两个模块,然后webpack会根据 lang 属性自动用适当的加载器去处理。
css
直接上手写样式即可,使用css规则。
引用外部css文件的写法。
<style lang="css"> @import './index.css' </style> 或者 <style lang="css" src="./index.css"></style>
如果需要使用sass
安装sass模块
npm install node-sass --save-dev npm install sass-loader --save-dev
在组件的style部分使用内联写法
<template></template> <script></script> <style lang="scss" scoped>//在这个部分添加lang="scss" //sass样式 </style>
引用sass外部文件的写法。
<style lang="scss" src="./index.scss"></style>
如果需要使用less
安装less模块
npm install less --save-dev npm install less-loader --save-dev
在组件的style部分使用内联写法
<template></template> <script></script> <style lang="less" scoped>//在这个部分添加lang="less" //less样式 </style>
引用less外部文件的写法。
<style lang="less" src="./index.less"></style>
结语:
仔细阅读,按步骤来基本上可以配置成功。如果有哪个地方写的不够清楚的,欢迎指正。本文面向小白,写着玩,大手请轻喷。希望对大家的学习有所帮助,也希望大家多多支持黑区网络。