项目构建
- 在webstorm中打开终端,进入项目目录
- 输入 vue init webpack pytools-fe-ver1.0 初始化项目
- 项目名称为pytools-fe-ver1.0
- 添加项目描述,作者
- runtime选择第一项’Runtime + Compiler’,按空格切换,按回车确认
- Install vue-router 选择Y
- Use ESLint to lint your code? 选择Y
- Standard 选择’Stander’
- Set up unit tests 选择N
- Set up e2e tests 选择N
- Should we run
npm install for you after the project has been created? 选择’Yes,use npm’ - 初始化项目完成
- cd pytools-fe-ver1.0 进入项目目录
- webstorm右上角点击 添加配置
- 点击加号添加新配置
- 选择npm,选择package.json,自动添加文件位置;脚本,选择 dev ,点击应用
- 点击右上角运行,即可在浏览器中看到vue构建完成的欢迎界面
- 默认浏览器选择谷歌浏览器
- 在谷歌浏览器的扩展商店中安装vue-devtools插件
- 在浏览器的开发者工具中将Disable cache(禁用缓存)勾选上
- 在webstorm中将ESlint设置为自动ESLint配置,规范编码格式
目录结构
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2022/5/26 21:35 build
d----- 2022/5/26 21:35 config
d----- 2022/5/26 21:36 node_modules
d----- 2022/5/26 21:35 src
d----- 2022/5/26 21:35 static
-a---- 2022/5/26 21:35 230 .babelrc
-a---- 2022/5/26 21:35 147 .editorconfig
-a---- 2022/5/26 21:35 30 .eslintignore
-a---- 2022/5/26 21:35 791 .eslintrc.js
-a---- 2022/5/26 21:35 154 .gitignore
-a---- 2022/5/26 21:35 246 .postcssrc.js
-a---- 2022/5/26 21:35 279 index.html
-a---- 2022/5/26 21:36 1165135 package-lock.json
-a---- 2022/5/26 21:35 2209 package.json
-a---- 2022/5/26 21:35 503 README.md
项目仓库
Gitee
|