认识vs code创建项目内容

接上篇搭建好环境之后创建一个项目,打开项目文件。

//md文件里面的备注用#
npm install//安装依赖的命令
npm run build//文件打包命令,文件打包之后会在项目里生成一个dist,直接用dist文件就可以了
npm run dev//启动命令

build:项目构建(webpack)相关代码。
package.json是项目配置文件,里面有项目信息。vue里,向上箭头指向上更新。
index.html是网页入口文件,是个静态网页,不需要动,也可以用来添加一些meta信息或统计代码。
postcssrc.js是配置解析文件的。
gitignore是用来写后缀名的,
test:初始测试目录,可删除。
static是静态资源管理文件,这个里面的文件通过文件直接使用,不需要通过服务器使用,直接通过静态路径可以拿到。
src其中的main.js,是项目的核心文件,启动之后找到模板,并且吧模板渲染到index页面上。components文件放置组件,assets放置一些图片,如logo等,APP.vue是整个项目的入口文件,可以直接将组件写到这里,不使用components。
node_modules里面是所有的环境支持,用到的插件都在里面。也就是npm加载的项目依赖模块。
config里面是配置文件,配置版本。config里面的index.js可以用来配置端口什么的。
README项目的说明文档,提示命令的使用,使用的是markdown格式。
webpack-dev-server.js用来启动服务器。

创建并运行一个新建好的文件

创建项目文件夹:vue init webpack 文件名这个是完整版,简单版是vue init webpack-simple 文件名
进入创建好的文件夹cd 文件名
建立依赖:cnpm install,如果文件夹里出现了node_modules,那么表示依赖建立完成。
运行:cnpm run dev出现端口网址等,表示运行成功。按住ctrl+点击就可访问。

更多推荐

vs code文件的打开和运行