高端企业网站建设方案,做电商什么素材网站好,免费网站下载app软件免费,我的个人博客前些天发现了一个巨牛的人工智能学习网站#xff0c;通俗易懂#xff0c;风趣幽默#xff0c;忍不住分享一下给大家。点击跳转到教程。
1. 安装node#xff1a;
sudo yum install epel-release
sudo yum install nodejs
node --version // 安装好后查看版本2. 安装 npm …前些天发现了一个巨牛的人工智能学习网站通俗易懂风趣幽默忍不住分享一下给大家。点击跳转到教程。
1. 安装node
sudo yum install epel-release
sudo yum install nodejs
node --version // 安装好后查看版本2. 安装 npm 和 express sudo yum install npm --enablerepoepelsudo npm install -g expresssudo npm install -g express-generatornpm -v // 安装好后 查看版本注意有时安装成功后,需要关闭xshell重新启动。npm才会生效。
3.安装 cnpm
npm install -g cnpm --registryhttp://registry.npm.taobao.org 4.安装脚手架 vue-cli :
npm install -g vue-cli vue -v // 安装好后 查看版本
5. 用 vue-cli 构建项目 windows 和 linux 都可以按此方法构建
选择一个确定目录 D:\node 作为项目存放目录。
切换到该目录下执行命令行命令 vue init webpack firstApp // 自动构建一个完整项目
会有一些选项要求选择设置 选项说明如果只是测试项目可以一直按回车
Project name :项目名称 如果不需要更改直接回车就可以了。注意这里不能使用大写所以我把名称改成了vueclitestProject description:项目描述默认为A Vue.js project,直接回车不用编写。Author作者如果你有配置git的作者他会读取。Install vue-router? 是否安装vue的路由插件我们这里需要安装所以选择YUse ESLint to lint your code? 是否用ESLint来限制你的代码错误和风格。我们这里不需要输入n建议如果你是大型团队开发最好是进行配置。setup unit tests with Karma Mocha? 是否需要安装单元测试工具KarmaMocha我这里不需要所以输入n。Setup e2e tests with Nightwatch?是否安装e2e来进行用户行为模拟测试我这里不需要所以输入n创建成功如下图在finished 上面可能会有多行红色 error 信息不用关注无影响。 这时应该在路径 D:\node下已经生成项目firstApp 结构如下
在这一步还没有文件夹node_modules后面才会生成。 项目结构说明
build最终发布的代码的存放位置。config配置路径、端口号等一些信息我们刚开始学习的时候选择默认配置。node_modulesnpm 加载的项目所需要的各种依赖模块。src这里是我们开发的主要目录源码基本上要做的事情都在这个目录里面里面包含了几个目录及文件assets:放置一些图片如logo等components:目录里放的是一个个的组件文件router/index.js配置路由的地方App.vue项目入口组件跟组件我们也可以将组件写这里而不使用components目录。主要作用就是将我们自己定义的组件通过它与页面建立联系进行渲染面的router-view/必不可少。main.js 项目的核心文件整个项目的入口引入依赖包、默认页面样式等。static静态资源目录如图片、字体等。test初始测试目录可删除.XXXX文件配置文件。index.htmlhtml单页面的入口页面可以添加一些meta信息或者同统计代码啥的或页面的重置样式等。package.json项目配置信息文件/所依赖的开发包的版本信息及所依赖的插件信息。README.md项目的说明文件。webpack.config.jswebpack的配置文件把.vue的文件打包成浏览器能读懂的文件。.babelrc:是检测es6语法的文件的配置.getignore:忽略文件的配置比如模拟本地数据mock不让他在get提交/打包上线的时候忽略不使用可在这里配置.postcssrc.js:前缀的配置 cd 到项目路径下执行加载 jar 包的命令
cnpm install
此后项目会多一个 node_modules 文件夹里面是依赖包资源。
6. 运行项目
npm run dev
// 或者
npm run start
运行成功 7. 浏览器中访问localhost:8080 到此Demo 已经正常运行了。 附加说明
8. 把项导入 VSCode
main.js 是整个项目的主入口此页面代码固定可以永远不修改。 9. 配置路由
index.js中配置路由import是引用哪个 vue 文件routes 是多个路由设置。
如下图 HelloWorld 和 test 分别是 2 个 vue 文件。 10. 简单修改代码 不用手动刷新浏览器会自动刷新如下 另/template 标签相当于 jsp 的html 标签。
就这么多我还在学... 参考https://blog.csdn.net/jiangyu1013/article/details/83855476
