vueSSR: 从0到1构建vueSSR项目 — 初始化

32次阅读

共计 874 个字符,预计需要花费 3 分钟才能阅读完成。

开始
初始化
npm install -g @vue/cli nodemon
nodemon 检测目录文件更改时,来重启基于 node 开发的程序
vue create vuessr
我选的附带 babel,eslint
cd vuessr
创建文件以及文件夹
type null > vue.config.js

//node 相关配置文件
mkdir nodeScript
cd nodeScript
type null > index.js
type null > proxy.js
type null > server.js
进入 src 目录
// 目录初始化
cd ../src
type null > router.config.js // 路由配置
mkdir pages // 项目展示页面主要目录
cd pages
mkdir router
mkdir entry //vue-cli3 entry 的相关配置入口 vueSSR 需要。
mkdir static/js //gulp 提取框架, 插件等几年不动的源码整合后存放于 cdn 服务器
mkdir static/css //gulp 提取整合初始化的样式表,存放的位置
mkdie methods //vue 等全局代码的存放比如拦截器 use mixin 兼容函数
// 安装依赖
npm install –save-dev
sass-loader
npm-run-all npm 运行多个命令 -s 是顺序 - p 是并行
cross-env 可以修改 node 环境变量
webpack-node-externals 忽略 node_modules 文件夹中的所有模块
vue-server-renderer 不解释
修改 eslint 配置
package.json
eslintConfig
rules 这个对象下面添加,cli 的 eslint 附带以下的配置 所以手动关闭下。
“no-console”: 0,
“no-unused-vars”: 0,
“no-undef”: 0

如果你觉得 eslint 警告很烦,那么可以
vue.config.js
module.exports = {
…,
lintOnSave:false,

}

明天开始配置 vue-router vuex entry 相关
github 欢迎 watch

正文完
 0