vuejs配置less

在webstorm上配置Less

  首先,全局安装less

  npm install less -g

  然后,在webstorm上配置less插件,"File" --> "settings"-->"Tools"

  

  在"file Watchers" -->"+"-->"Less"

  

  在"Program"里填写less的安装路径;

  在"Argument" 里的不用修改;

  在"Output paths to refresh"里填写解析的.css文件路径,($FileNameWithoutExtension$.css 这是解析在与less同一路径目录下);

  

Vue项目配置Less

  首先,安装less依赖:"less" 与 "less-loader";  

  npm install less less-loader --save(这里最好是写成--save)

  接着,配置webapck解析,"bulid"-->"webpack.base.config.js",添加一下代码

{
      test: /\.less$/,
      loader: ‘style-loader!css-loader!less-loader‘
 }

简说安装依赖是"--save"和"--save dev"的区别

  我们在使用npm install 安装模块或插件的时候,有两种命令把他们写入到 package.json 文件里面去,比如:

    --save-dev

    --save

  在 package.json 文件里面提现出来的区别就是,使用 --save-dev 安装的 插件,被写入到 devDependencies 对象里面去,而使用 --save 安装的插件,则被写入到 dependencies 对象里面去。

  那 package.json 文件里面的 devDependencies  和 dependencies 对象有什么区别呢?

  devDependencies  里面的插件只用于开发环境,不用于生产环境,而 dependencies  是需要发布到生产环境的。

转载:http://www.cnblogs.com/hawk-zz/p/6543330.html

时间: 2024-11-03 03:44:48

vuejs配置less的相关文章

vuejs开发笔记—IDE选择和WebStorm性能优化、框架特性和数据调用、路由的配置以及原理

一.IDE的选择: VsCode和WebStorm都是不错的选择,两者运行调试都非常的方便都可以使用快捷键运行和停止,就打开项目的速度和对电脑配置的要求来说,vscode要比webstorm要出色很多,如果电脑配置足够好的情况下请忽略前面说的性能问题,具体的使用要看个人的需求和爱好了. 1.先说VsCode的配置: 首先是要装VsCode的扩展插件,点击左上角最后一个图标,在搜索里面输入JavaScript (ES6) snippets/NPM/Vue 2 Snippets: 第二步调试配置:V

vueJs+webpack单页面应用--vue-router配置

vue-route版本要跟vue版本同步,我的vue用的2.0+的,vue-router 也用了最新版2.1+ npm安装vue-router: $ npm install vue-router --save-dev 使用: 1.引入 vue-router:     import VueRouter from 'vue-router'; 2.注册:     Vue.use(VueRouter); 3.配置路径: const routes = [ { path: '/goods', compone

webpack + vuejs 基本配置(一)

开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack2.Vue.js3.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在你实践的过程中要去不断访问的5.ES6语法 另外,这套教程的代码都在我的github上,读者可以对照着代码来看,不过还是希望大家自己亲手搭建,体验这个过程,git地址: git地址 前言 在对着产品高举中指怒发心中之愤后,真正能够解决问题的是自身上的改变,有句话说的好:你虽然改变不了全世界,但是你有机会

原创全新打包工具Parcel零配置VueJS开发脚手架

parcel-vue 一个基于Parcel打包工具的 VueJS急速开发脚手架解决方案,强烈建议使用node8.0以上 项目地址: https://github.com/w3c-king/p... 初始化项目 $ git clone https://github.com/w3c-king/parcel-vue.git <h4>安装依赖</h4> <pre class="brush:shell">$ cd parce-vue $ npm install

vuejs心法和技法

http://www.cnblogs.com/kidsitcn/p/5409994.html 注意:本文记录作者在学习和使用vuejs开发中的点点滴滴,从vuejs1.0开始直到现在的vuejs2.0以后的版本.期中部分1.0的内容已经过时,仅作各位朋友参考,建议重点关注2.0相关的内容,会随着我对vuejs有了更多的体会后不断维护更新,也欢迎朋友们批评指正共同学习提高. 所有的vuejs组件都是被扩展的vue实例: var MyComponent = Vue.extend({ //扩展选项对象

vue安装与配置

直接引入 <script src="https://unpkg.com/vue"></script> 用npm安装   $ npm install vue Vue.js 提供一个官方命令行工具,vue-cli可创建并启动一个带热重载.保存时静态检查以及可用于生产环境的构建配置的项目 # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpack my

vue2.0 配置环境总结(都是泪啊)

最近有点空闲时间,终于把一直想学的vue提上了日程,以下是收集的一些帮助入门的链接 1:https://vuefe.cn/v2/guide/ vue2.0中文官网 2:https://router.vuejs.org/zh-cn/index.html vue2.0路由中文官网 3:https://github.com/jsfront/src/blob/master/vuejs.md 有一些不错的vue插件,教程,视频和学习资料分享 一些不错的vue2.0博客分享: 1:https://segme

TODO:搭建Laravel VueJS SemanticUI

Laravel是一套简洁.优雅的PHP开发框架(PHP Web Framework).可以让你从面条一样杂乱的代码中解脱出来:它可以帮你构建一个完美的网络APP,而且每行代码都可以简洁.富于表达力. VueJS是一款渐进式JavaScript框架,有着易用,灵活,高效的有点.简单小巧的核心,渐进式技术栈,足以应付任何规模的应用. SematicUI 是完全语义化的前端界面开发框架,跟 Bootstrap 和 Foundation 比起来,还是有些不同的,在功能特性上.布局设计上.用户体验上均存在

vuejs从安装开始一起飞~

要写一个基于vuejs的项目,首先安装vue~这个可以在安装nodejs时一并安装 一.安装nodejs 1.去nodejs官网对应下载合适的nodejs,然后安装 2.在菜单栏搜索cmd,右键以管理员身份打开必须是管理员身份 3.输入  node -v    出现版本号说明nodejs安装成功 3.再输入   npm install vue  ,开始安装vue,结束后输入 npm -v,出现vue的版本号,则说明安装成功,否则安装失败! 4.安装失败的盆友需要  百度搜索npm淘宝镜像网站,使