笔记1.1：vue-cil脚手架工具创建项目

最新推荐文章于 2024-09-17 13:42:29 发布

一条咸鲨鱼

最新推荐文章于 2024-09-17 13:42:29 发布

阅读量214

点赞数

分类专栏： vue前台开发文章标签： vue.js webpack javascript

本文链接：https://blog.csdn.net/save_mental/article/details/121522983

版权

1 篇文章 0 订阅

订阅专栏

本文介绍了如何利用vue-cil脚手架创建Vue项目，详细步骤包括创建空文件夹、安装必要环境、运行创建命令并配置项目。此外，还讲述了如何在项目中配置开发环境，特别是如何引入less预处理器，包括安装less和less-loader，并在webpack配置中进行相应调整。

摘要由CSDN通过智能技术生成

vue、vue-cil、webpack

1.创建一个空文件夹tmWebView

2.安装创建项目需要的环境

// 安装webpack
   $ npm install --save-dev webpack
// 安装vue、vue-cil
   $ npm install vue vue/cil -g;

3.运行创建项目命令

// 创建项目tm-web-view
   $ vue init webpack tm-web-view

然后根据自己的需求选择项目配置

4.运行项目

//  vue/vil@2.x 
   $  npm run dev
   
//  vue/vil@3.x 
   $  npm run serve

5.效果
在这里插入图片描述

1、在项目中引入less预处理器
1.1.安装 npm install less-loader@5.0.0 less
1.2. 在webpack.base.config.js 里边的rules中添加指定代码：

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

1.3.将style标签加入lang=less

关注

专栏目录