使用 vue init webpack 项目名 创建项目

最新推荐文章于 2022-05-22 00:41:00 发布
最新推荐文章于 2022-05-22 00:41:00 发布
阅读量1w 收藏 25
点赞数 4
分类专栏： 笔记 文章标签： vue js npm webpack 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45832807/article/details/105264381
版权
  1. 检测node和npm的版本
    在这里插入图片描述
  2. 使用vue init webpack 项目名称创建项目
    在这里插入图片描述
  3. 切换到项目文件下面
    在这里插入图片描述
  4. 通过npm run dev运行项目
    在这里插入图片描述
    如果报错说'webpack-dev-server' 不是内部或外部命令，也不是可运行的程序 或批处理文件，就npm install安装package.json文件中的所有依赖模块。
    在这里插入图片描述
  5. 在浏览器中打开生成链接的网页，查看项目生成是否成功
    在这里插入图片描述
    如果安装成功，打开链接后就是上图呈现的样式。
  6. 项目文件解析
    在这里插入图片描述
HerayChen
关注
  • 4
    点赞
  • 踩
  • 25
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
使用vue init webpack 项目名建立vue cli2.x项目
yazhoushanheji的博客
05-17 263
使用vue init webpack建立项目
vue入门002~vue项目的两种创建方式
最新发布
2401_85112269的博客
06-24 274
我个人觉得面试也像是一场全新的征程，失败和胜利都是平常之事。所以，劝各位不要因为面试失败而灰心、丧失斗志。也不要因为面试通过而沾沾自喜，等待你的将是更美好的未来，继续加油！6，使用webstorm打开项目，点击file，然后点击open。1，点击file，然后new，然后点击project。二，使用webstorm一键创建vue项目。3，上面构建成功后，可以运行并浏览项目了。项目运行成功后，在浏览器里打开下面链接。到这里就代表项目成功的创建并运行了。3，等待项目创建和类库加载。项目创建完成后，如下。
vue init webpack ‘项目名称’ 运行报错
qq_41429765的博客
08-26 237
Command vue init requires a global addon to be installed. Please run npm install -g @vue/cli-init and try again. 创建项目需要将vue-cli进行去全局安装 使用命令： npm install -g @vue/cli-init
使用命令”vue init webpack 项目名称”出错
thankseveryday的专栏
05-16 9332
学习一样新东西，总感觉成本很高，高就高在一堆莫名其妙的问题，好像只有我一个人会遇到。 ❗️ 为了保证安装顺利 Windows用户使用管理员运行cmd mac用户使用命令sudo su -开启root权限 然后执行以下安装命令： 安装nodejs 顺便会默认装好npm，官网下载地址： https://nodejs.org/zh-cn/ 我选择的是长期支持版 打开终端，查看是否安装成功 node ...
vue2+webpack2 初始化项目
u013400682的博客
08-09 1330
准备工作 下载并安装node.js 安装vue cli脚手架 npm install --g vue-cli项目初始化官网给出了两个模板： webpack-simple 和 webpack 。区别在于webpack-simple 没有包括Eslint 等检查功能，所以普通项目基本用webpack-simple 就足够了。于是我用webpack-simple 初始化的项目，运行之后，页面能正常显示，但
vue init webpack 建vue项目报错的解决方法
10-17
Vue CLI提供了多种模板来初始化项目，其中Vue CLI 3.x版本之前，通常使用`vue init webpack`命令来创建基于Webpack的项目模板。然而，在创建项目过程中，可能会遇到一些报错，导致无法正常进行。本文将详细介绍遇到...
vue init webpack myproject构建项目 ip不能访问的解决方法
08-27
然而，有时在使用 `vue init webpack myproject` 构建的项目中，可能会遇到一个问题：当尝试通过本地 IP 访问（例如 192.168.x.x）项目时，页面无法正常加载，而使用 `localhost` 或 `127.0.0.1` 却能正常访问。...
详解使用vue脚手架工具搭建vue-webpack项目
08-30
我们可以使用以下命令初始化项目：`vue init webpack yourprojectname`。这里的 `yourprojectname` 是项目名称，可以根据需要修改。 知识点 7: 项目目录结构 初始化项目后，我们可以查看项目目录结构。项目目录...
使用vue-cli脚手架工具搭建vue-webpack项目
10-17
运行 `vue init webpack yourprojectname`（将`yourprojectname`替换为你项目的名字）。在初始化过程中，系统会提示你输入项目名称、描述、作者等信息。完成后，你会看到一个新的VueWebpack项目已经创建完毕，包含了...
vue+webpack安装,生成初始化vue项目
前端劝退师的博客
11-18 1408
一、webpack安装。 当然，在这之前，你得先安装好node.js。 1、npm安装webpack。 npm install -g webpack //全局安装 npm install -g webpack-dev-server //安装调试工具 2、创建项目 mkdir projectName //创建项目文件夹 cd projuectName //进入该文件目录下 npm init //在目录下创建package.json文件，一直回车即可，也可输入你想要修改的内容 之后在目标文
Vue create 项目名 和 Vue init webpack 项目名 的区别
yazhoushanheji的博客
04-26 667
vue,vue-cli2.x,vue-cli3.x,vue create XXX，vue init webpack XXX
vue init webpack （基于vue.js的官方webpack模板）
LavanSum的博客
07-06 2659
使用vue-cli(2.9.3,当前最新2.9.6)执行vue init webpack初始化项目骨架：1、完整功能版（包括ESLint，包括测试功能）node_modules 1021个对象  整个目录大小121M多一个test目录config目录（webpack配置文件）下多一个配置文件：test.env.js2、非完整功能版（包括ESLint，不包括测试功能）node_modules  81...
VUE 使用 vue init webpack 命令 创建VUE 2.0项目步骤 超详细教程 vue刚入门的福音
不想成为可以改变世界的程序员，不是一个好程序员
05-22 7803
VUE VUE 2.0项目创建步骤 超详细教程 vue刚入门的福音 命令行内 输入命令：vue init webpack test-vue-admin test-vue-admin 是想要创建的项目名称，由大家自定义 注意vue2.0项目用这个指定的命令，用其他命令可能导致你创建vue2.0项目时，项目内会有一些vue3.0的东西
vue webpack init_浅尝webpack
weixin_39788703的博客
11-24 788
吐槽一下webpack 自出现时，一直备受青睐。作为强大的打包工具，它只是出现在项目初始或优化的阶段。如果没有参与项目的构建，接触的机会几乎为零。即使是参与了，但也会因为项目的周期短，从网上东拼西凑草草了事。纵观网上的 webpack 教程，要么是蜻蜓点水，科普了一些常规配置项；要么是过于深入原理，于实际操作无益。最近一段时间，我把 webpack 的官方文档来来回回地看了几遍，结果发现，真香。中...
VSCode创建Vue项目
qq_26132519的博客
12-13 1210
通过VSCode创建Vue项目 Nodejs安装：下载地址Download | Node.js 下载完成后默认安装，安装完成后打开cmd 输入下面的命令查看是否成功安装，同时验证npm，因为跟node同时安装 安装vetur 安装ESLint 选择终端（Terminal），选择新建终端（New Terminal），通过命令切换到准备存放的文件夹 输入vue init webpack 项目名称，如提示这个错误信息，请往下看 在windows系统中打到windows po...
Vue init webpack demo
Tom__cy的博客
05-14 2192
安装命令为：npm install -g cnpm --registry=https://registry.npm.taobao.org 接着安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架 命令为：cnpm install -g vue-cli 输入:vue init webpack my-vue(项目文件夹名)，回车， ...
Vue学习笔记之Vue CLI脚手架的介绍和安装-CLI2的介绍
医疗数据
11-30 240
1、概念：CLI(Command-Line Interface)，命令行界面，俗称脚手架。通过配套的图形化界面创建、开发和管理你的项目。Vue CLI 完全是可配置的，无需 eject。这样你的项目就可以长期保持更新了。使用vue-cli可以快速搭建Vue开发环境以及对应的webpack配置。 2、环境安装（需要node、webpack的环境支撑）：cnpm install -g @vue/cli 进行全局安装即可 官网介绍： 通过cnpm install -g @vue/cli 命令安装完后，用
vue-cli之初始化项目（二）
weixin_33971130的博客
05-08 2649
1、vue init命令讲解用vue init命令来初始化项目，具体使用方法如下：vueinit<template-name><project-name>init：表示要用vue-cli来初始化项目<template-name>：表示模板名称，vue-cli官方提供的5种模板：webpack：一个全面的webpack+vue-load...
vue vue init webpack
09-12
Vue CLI是一个官方提供的脚手架工具，用于快速搭建Vue.js项目。当你输入"vue init webpack"命令时，它会创建一个基于Webpack的Vue.js项目模板。 引用中提到了一个简单的webpack vue-loader模板，该模板不包含其他功能，可以帮助你快速搭建Vue的开发环境。而引用中提到的完整的webpack vue-loader模板则包含了更多功能，如热加载、语法检测和CSS扩展等。 在实际开发中，一般会选择使用webpack这个模板来搭建Vue项目。你可以使用以下命令来初始化项目： ``` vue init webpack my-vue-demo ``` 在初始化过程中，你可以设置项目的名称、描述和作者等信息。选择是否安装vue-router来使用Vue的路由插件，以及是否使用ESLint来限制代码错误和风格。如果需要安装单元测试和e2e测试工具，也可以选择相应的选项。 初始化完成后，你可以进入项目目录并运行以下命令来启动开发模式： ``` cd my-vue-demo npm run dev ``` 如果需要发布打包项目，可以运行以下命令： ``` npm run build ``` 以上是使用"vue init webpack"命令初始化Vue项目的基本步骤。更详细的文档可以在https://vuejs-templates.github.io/webpack找到。
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值