创建Vue脚手架，用的webpack模板

最新推荐文章于 2024-08-19 20:15:33 发布
最新推荐文章于 2024-08-19 20:15:33 发布
阅读量276 收藏
点赞数 1
分类专栏： vue 文章标签： vue github js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44743897/article/details/108060701
版权

创建Vue脚手架

一、下Vue模板项目

（我使用的工具是webstrom）

  1. vue-cli 是 vue 官方提供的脚手架工具

  2. github: https://github.com/vuejs/vue-cli

  3. 作用: 从 https://github.com/vuejs-templates 下载模板项目
    在这里插入图片描述
    4.文件框中输入cmd命令，打开cmd窗口
    在这里插入图片描述
    5.在命令窗口输入npm install -g vue-cli命令，脚手架全局安装。
    6.安装好输入vue检查，安装成功效果如下
    在这里插入图片描述
    7.用该命令vue init webpack vue_demo 创建vue项目，vue_demo项目名。自行可以更改
    8、项目名必须小写，不能大写，其中选NO的是我当前用不到的，自行根据当时项目需求而定。
    在这里插入图片描述
    9、选中npm或yarn下载，也可选择第三步手动下载。
    在这里插入图片描述
    10、模板项目结构解释
    在这里插入图片描述
    11、运行命令npm start或npm run dev

慎挚
关注
专栏目录
vue-cli脚手架构建工具,创建一个基于 webpack 模板的新项目
Als_zhangchangxiao的博客
11-10 964
项目打包、优化、上线 前提: 1、备份 备份文件都叫backup 2、运行代码 2.1、npm run serve 测试项目能不能跑起来 2.2、npm run build 直接运行 进行压缩打包,会把dist干掉 2.3、打完包之后需要做的事 1. 运行代码 ...
基于webpack5从0搭建Vue脚手架
Zzh1110的博客
11-08 630
watch：当webpack发现有代码变换的时候，它会重新编译、重新打包。开始创建一个项目，肯定需要一个html网页，并且引入打包后的js文件。大体上是一样的，只不过vue3的api会不同，以及新建Vue实例那里。在src下创建router文件夹，并创建index.js文件。bundle.js还不存在，所以需要去安装开发依赖。“build” ： 上线的时候运行构建命令。具体的写法和vue的一样，这里就不贴出来了。在使用npm安装package之前，得先。src下放的是我们的源代码。
vue-webpack模板
01-08
vue 组件化 webpack 模板
vue脚手架
weixin_45904557的博客
07-25 653
VueCLI是一个基于Vue.js进行快速开发的完整系统通过@vue/cli搭建交互式的项目脚手架。
vue脚手架模板文件
最新发布
吹梦到西洲
08-19 284
【代码】vue脚手架模板文件。
vue-cli 脚手架总结
akya8707的博客
07-18 162
> vue-cli 的脚手架项目模板有browserify 和 webpack , 现在自己在用的是webpack , 官网给出了两个模板： webpack-simple 和 webpack 两种。两种的区别在于webpack-simple 没有包括Eslint 检查功能等等功能，普通项目基本用webpack-simple 就足够了. 搭建官方项目模板步骤： 　　1、n...
vue--Vue脚手架框架搭建项目
鑫709的博客
05-05 1006
前提：搭建好NodeJS环境 创建Vue项目前准备 验证安装是否成功 1、安装node.js和npm 按键win+r,输入前提：搭建好NodeJS环境打开命令行工具 ​ 出现以上版本显示，代表安装成功 2、安装webpack 安装webpack，按键wind+r再输入cmd点击enter键 打开命令行工具输入：npm install webpack -g，安装完成之后输入 webpack -v，如下图，如果出现相应的版本号，则说明安装成功。 ​ 在此目录下有生成webpack
vue-ts webpack 模板
fang_ze_zhang的博客
07-01 236
<template> #[[$END$]]# </template> <script lang="ts"> import { Component, Vue } from "vue-property-decorator"; @Component #set($capitalizedFilename = $NAME.substring(0,1).toUpperCase() + $NAME.substring(1)) export default class $capital
vue脚手架和webpack
12-31
在上述示例中，我们使用了Vue脚手架创建了一个新的Vue项目，并使用Webpack作为项目的打包工具。通过运行`npm run serve`命令，我们启动了一个开发服务器，可以在浏览器中实时预览我们的应用程序。
vue-app-starter：一个用于快速创建Vue项目的模板脚手架，使用Webpack与Storybook构建的示例。使用Webpack和Storybook创建Vue应用程序的样板
02-03
一个用于快速创建Vue项目的模板脚手架，使用Webpack与Storybook构建。 快速开始 git clone https://github.com/senntyou/vue-app-starter.git --depth=1 cd vue-app-starter npm install # 安装依赖 npm run ...
vuejs-webpack-template:Vue.js Webpack模板
05-14
vuejs-webpack-template vuejs2和webpack4 第一的 npm install 发展 npm run start 生产 npm run build
vue-cli3-template：基于Vue-cli3建造的脚手架项目模板
01-31
项目介绍 基于Vue-cli3建造的前端开发脚手架项目模板，主要包括以下内容：Webpack4.x性能调优配置，Vue.js全家桶，移动端vw适应，单元测试等功能，可以参考，欢迎大家围观指教！ 项目特点 特征 巴别塔 VueRouter 威克斯 CSS预编译工具：更少 HTTP库：Axios 代码规范：eslint airbnb规范 业务代码和第三方库区分打包：DllPlugin 删除冗余代码：UglifyJsPlugin 开启Gizp压缩：compression-webpack-plugin 配置约会公共样式文件 使用别名简化路径 vw移动端适应 文件结构可视化：webpack-bundle-analyzer 安装及快速开始 # 克隆项目 $ git clone https://github.com/liangfengbo/vue-cli3-template # 进入目录 $ cd vue-cli3-template # 安装依赖包 $ yarn install # 启动项目 $ yarn serve # eslint 检测 $ yarn lint # eslint 修复
基于webpack的多页脚手架
08-10
基于webpack的多页脚手架
Vue-Official-website:基于vue的官网脚手架
05-17
这是一个基于vue的框架来做公司的官网模板 优点： 搭建快速 模块引用 利于seo 缺点： 现阶段数据无法从接口获取展示 现阶段还有一些问题，请大家共同完善。这只是一种思路，通过更佳快捷方便的开发方式，让我们有更多的精力，去扩展其他内容。
vue-cli配置axios
qq_40663787的博客
01-10 434
"use strict"; import Vue from 'vue'; import axios from "axios"; import VueAxios from 'vue-axios' // Full config: https://github.com/axios/axios#request-config // axios.defaults.baseURL = process.e...
webpack构建Vue脚手架
Jacky的笔记
07-13 661
新建一个文件夹，在这个文件夹下安装依赖。基于 webpack 5 从零搭建 Vue 脚手架使用的依赖有：vue、element-ui、vue-router 开发依赖有：webpack、webpack-cli、vue-loader、vue-template-compiler、sass-loader、sass、css-loader、style-loader、babel-loader、@babel/core、@babel/preset-env有些暂时用不到，但是可以先一次性把他们安装进来。写页面需要index.h
webpack搭建vue脚手架（从零开始）
自然 醒的博客
08-16 912
都会作为模块处理。在webpack4以及之前版本都需要借助file-loader和url-loader进行打包图片，而在webpack5版本中不需要了，只需要进行配置就可以了，不需要进行任何loader。就会生成一个index.html和bundle.js,这时，点开index.html就能看的Hello World了，但是css还不能生效，需要借助一些loader去加载静态资源。输出(Output)指示 webpack 打包后的资源 bundles 输出到哪里去，以及如何命名。
通过vue -cli脚手架创建一个模板项目
qq_35008624的博客
04-21 571
通过vue -cli创建一个模板项目： 前期工作： 安装 node.js配置环境变量 安装 npm 配置对应的变量 安装 vue -cli，配置对应的环境变量 ，vue.cmd所在的路径配置在path中 安装步骤： 【1】打包项目，输入项目名称，项目描述 【2】设置以下属性 【3】设置完了出现以下界面 【4】运行npm运行项目 出现以上问题，原因是...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值