一、在使用之前,先了解三件东西是用来做什么的。 npm: Nodejs下的软件包管理器。 webpack:的主要用途是使用CommonJS语法来准备需要在所有浏览器端发布的静态资源,包括资源整合和打包。 Vue-cli:用户将生成vue工程模板。 (我会尽快开始vue的项目。 也就是说,给定包含基础依赖关系库的vue结构,使其只能通过npm install安装) :
如图所示,下载8.9.3 LTS。 推荐给大多数用户。
双击安装
可以使用默认路径。 在本示例中,将更改为d:nodejs
一点Next
点完成
打开CMD,检查是否正常
让我们看看另外两个目录。 npm的本地仓库运行在系统盘c驱动器的用户目录中。 (找不到npm-cache是因为未使用。 使用缓存目录时生成。 )将这两个目录移动到d:(nodejs并返回到d3360(nodejs ),创建两个目录,如下图所示,然后将以下两个命令npm config set prefix 'D:更改为nodejs 注意NPM的本地仓库,然后输入npm list -global命令,如node _ global ' npmconfigsetcache ' d :nodejsnode _ cache '上的照片
输入npmconfigsetregistry=http://registry.NPM.Taobao.org命令以配置镜像工作站
输入npm config list命令以显示所有配置信息。 注意配置文件c :usersadministrator. NP MRC
使用文本编辑器编辑它,可以看到刚才的配置信息
确定镜像工作站是否可以运行1 NPM配置获取注册表命令
检查镜像工作站是否良好,然后运行2 Npm info vue命令,查看是否可以获得vue信息
在这种情况下,默认的模块D:nodejsnode_modules目录将更改为d :nodejsnode _ global _ node _ modules目录直接执行npm install等命令会报告错误。我们必须做一件事。 1、增加环境变量NODE_PATH的内容为d :nodejsnode _ globalnode _ modules
(注意,以下操作需要重新打开CMD才能启用上述环境变量: (一、测试NPM安装vue.js命令。 npm install vue -g这里的-g是指安装在全局全局目录中
二、测试NPM安装vue-router命令: NPM安装vue-router
运行npm install vue-cli -g安装vue脚手架
环境编辑path
在path环境变量中添加D:nodejsnode_global win10以下版本时,如果横向显示path,请使用分号【; 】
重新打开CMD并测试vue是否正常使用
请注意,vue-cli工具内置了包含webpack和webpack-simple的模板。 前者是一个相对复杂和专业的项目,并不位于根目录下的webpack.config.js中。
初始化,依赖安装
运行NPM安装依赖关系
npm run dev
成功的接口,提示打开地址http://localhost:8080
自动打开浏览器http://localhost:8080/#/
npm run build生成静态文件,并在dist文件夹下打开新生成的index.html文件
nmp下新创建的vue01目录说明: