搭建vue项目

csm0 2019-12-07

一、下载及安装node跟npm,安装node的时候就安装了npm,node下载地址:http://nodejs.cn/download/。使用node -v及npm -v查看版本。

二、下载及安装git,git下载地址:https://git-scm.com/downloads。使用git --versioin查看版本。

三、进入要放置项目的路径。运行命令mkdir 项目名 + cd 项目名 + npm init --yes。使得项目受node管理。

四、运行命令git init。使得项目受git管理。添加.gitignore文件(添加不需要上传到远程项目的目录或者地址。写法/目录名,不加/表示文件的当前目录,*.zip,**表示多级目录,!文件名表示不忽略这个文件)。

五、运行命令git add . + git commit -m "第一次提交" + git remote add origin 远程地址 + git push -u origin master。可以将本地代码上传到远程的master分支。之后修改了代码的话就正常提交就行。

五、运行命令npm install -D webpack。安装webpack4+的时候,不仅仅需要安装webpack,还需要安装webpack-cli(npm install -D webpack-cli),可以使用在package.json的script。加webpack -v判断webpack是否可以使用。全局安装的话,就可以在外面判断webpack是否可以使用

六、使用npm安装模块包的时候,--save-dev和-D都是代表安装模块到package.json的devDependencies中,开发环境需要的。可以使用npm install(或者npm i)安装模块。--global和-g进行全局安装。--save和-S安装模块到package.json的dependencies中,生成环境需要的。

七、添加webpack.config.js,.babelrc,.eslintrc.js,.eslintignore,.editorconfig文件。要使编辑器提示格式错误信息的话,要安装并开启eslint插件。假如.js文件提示了错误信息但是.vue文件没有提示错误信息,那么在编辑器的设置里面查找eslint然后打开settings.json,添加"eslint.validate": [ "javascript", "vue" ]。

八、vue 跟 vue-template-compiler这两个包的版本号要一致。

九、安装package.json的依赖包

具体代码见https://github.com/ShuLanHu/test-vue

相关推荐

lyjava / 0评论 2020-07-30