折腾vue--使用vscode创建vue项目(二)
1、安装webpack
npm install -g webpack
2、安装sass
npm install --save-dev sass-loader
npm install --save-dev node-sass
3、打开vscode的终端,创建vue程序,并创建vue程序
vscode新建终端:ctrl+shift+`,如果已经打开终端,无需新开终端
创建vue程序
vue init webpack myvue
4、配置sass支持
修改文件:build/webpack.base.conf.js
在rules节点中添加如下配置
{
test: /\.sass$/,
loaders: ['style', 'css', 'sass']
}
5、在style中,增加lang="scss"
不需要使用sass时,可以忽略sass支持的配置
6、运行vue
cd 项目目录
npm run dev
7、生成vue
npm run build
生成的代码,在未修改配置的前提下,在dist目录中
ps.
1、webpack的高版本并没有完全向下兼容,所以在编译时,如果版本不对,可能会导致出现错误
折腾vue--使用vscode创建vue项目(二)的更多相关文章
- 在使用vue+webpack模版创建的项目中使用font-awesome
前言:最近使用vue+webpack进行一个小项目的开发,按照官方模版文档完成项目初始化后打算引入ont-awesome字体图标库进行使用,引入过程中遇到一些问题并解决,现记录如下. 一开始进展很顺利 ...
- Eclipse+Maven创建webapp项目<二> (转)
Eclipse+Maven创建webapp项目<二> 1.开启eclipse,右键new——>other,如下图找到maven project 2.选择maven project,显 ...
- Eclipse+Maven创建webapp项目<二>
Eclipse+Maven创建webapp项目<二> 1.开启eclipse,右键new——>other,如下图找到maven project 2.选择maven project,显 ...
- vue第六单元(vue的实例和组件-vue实例的相关属性和方法-解释vue的原理-创建vue的组件)
第六单元(vue的实例和组件-vue实例的相关属性和方法-解释vue的原理-创建vue的组件) #课程目标 掌握vue实例的相关属性和方法的含义和使用 了解vue的数据响应原理 熟悉创建组件,了解全局 ...
- (尚018-第二章2.1)Vue使用vue-cli创建模板项目
2.1.1 1)vue-cli是官方提供的脚手架工具(注意:脚手架本身是个库) 2)github:https://github.com/vuejs/vue-cli 3)作用:从https://gith ...
- IntelliJ IDEA 14 创建maven项目二
前言: 在我的idea14使用maven创建web工程文章介绍了如何运用idea14创建maven项目--但有瑕疵,如下: 今天在群里交流才得知起因: 原来一直这样创建的--但结果都一样,均出现上面的 ...
- Eclipse+maven创建webapp项目<二>(转)
原文地址:http://www.cnblogs.com/candle806/p/3439469.html 1.开启eclipse,右键new-->other,如下图找到maven project ...
- 关于VsCode创建Vue基础项目的步骤以及相关问题
项目创建步骤: 1. 全局安装vue-cli 安装命令: npm install -g vue-cli 在vscode上打开一个终端,然后输入此命令(下为截图): 2. 安装webpack,打包js ...
- vue 2.0创建新项目
参考链接 https://segmentfault.com/a/1190000011275993 背景在安装完node的基础上,机器什么都没安装参考上述链接 一.下载vue $ cnpm insta ...
随机推荐
- DNS隧道基础
DNS协议是一种请求/应答协议,也是一种可用于应用层的隧道技术.虽然激增的DNS流量可能会被发现,但基于传统socket隧道已经濒临淘汰鸡TCP.UDP通信大量被防御系统拦截的状况,DNS.ICMP. ...
- Maven的scope属性作用域范围
在POM 4中,<dependency>中还引入了<scope>,它主要管理依赖的部署.目前<scope>可以使用5个值: 1. compile,缺省值,适用于所有 ...
- 下载 安装MYsql 服务器
摘自 https://blog.csdn.net/youxianzide/article/details/85319106 https://www.2cto.com/database/201805/7 ...
- 实验19:Frame-Relay
实验16-1. 帧中继多点子接口 Ø 实验目的通过本实验,读者可以掌握如下技能:(1) 帧中继的基本配置(2) 帧中继的静态映射(3) 多点子接口的应用Ø 实验拓扑 实验步骤n 步骤1 ...
- 探究HashMap1.8的扩容
扩容前 扩容后 机制 else { // preserve order Node<K,V> loHead = null, loTail = null;//低指针 Node<K,V&g ...
- qt QDockWidget QStackWidget的简单使用
stackdlg.h #ifndef STACKDLG_H #define STACKDLG_H #include <QtWidgets/QDialog> #include <QLi ...
- HotSpot虚拟机对象创建
2.3.1对象创建 Java是一门面向对象的语言,在Java程序的运行过程中无时无刻都有新的对象被创建出来.从语言的层面看,创建对象通常仅仅是一个new关键字而已,从虚拟机的角度看,创建对象又是怎样的 ...
- python 内置模块之ConfigParser--配置读写
用于对特定的配置进行操作,当前模块的名称在 python 3.x 版本中变更为 configparser. #配置文件test.cfg [section1] k1 = v1 k2 :v2 k3 = 1 ...
- Codeforces_490_E
http://codeforces.com/problemset/problem/490/E dfs,过程要注意细节,特别是当前位置取了与上个数当前位置相同是,若后面不符合条件,则当前位置要重置'?' ...
- codeforces 1025B Weakened Common Divisor(质因数分解)
题意: 给你n对数,求一个数,可以让他整除每一对数的其中一个 思路: 枚举第一对数的质因数,然后暴力 代码: #include<iostream> #include<cstdio&g ...