nuxt记录与坑
2018-08-31 本文已影响0人
adtk
开源地址:https://github.com/adtkcn/express_nuxt
在linux下nuxt build没成功。。。目前是在window下build拷贝.nuxt目录过去。。。
在head中有外链script的页面中,不能使用路由
在nuxt中使用axios:https://axios.nuxtjs.org/usage.html
安装两个模块
npm i --save @nuxtjs/axios @nuxtjs/proxy
module.exports = {
modules: ["@nuxtjs/axios", "@nuxtjs/proxy"],
axios: { proxy: true, retry: { retries: 3 } },//设置代理。最多重发三次
proxy: {
"/api/": {
target: "http://localhost:3000/api"
}
},
}
使用自带的vuex
//vue方法中
this.$store.state.a
this.$store.commit("", {});
//fetch 方法中
fetch ({ store, params }) {
store.commit('setStars', res.data)
}
这俩我用的第一个
if (process.browser) {}
//对于只适合在客户端运行的脚本,需要通过使用 process.BROWSER_BUILD 变量来判断导入
if (process.BROWSER_BUILD) {
require('external_library')
}
muse-ui服务端按需加载
npm i --save babel-plugin-import webpack-node-externals
module.exports = {
build: {
extractCSS: true,
babel: {
plugins: [
[
"import",
{
libraryName: "muse-ui",
libraryDirectory: "lib",
camel2DashComponentName: false
}
]
]
},
extend(config, { isDev, isClient, isServer }) {
if (isServer) {
config.externals = [nodeExternals({ whitelist: [/^muse-ui/] })];
}
}
},
}