初始化kbone（react）并将页面文件位置修改

先全局安装 kbone

$ npm install -g kbone-cli

 

创建 kbone 项目，并选择 react

$ kbone init learn_kbone

　　

目前直接运行 npm run web 是可以将项目跑起来的，但是目前项目的页面都直接放在了 /src 目录下面，我想把项目的页面文件改到 /src/pages 里面，那么需要对下面的一些页面进行改造：

 

1、在 /src 文件夹下新建 pages 文件夹，将 /src 文件夹下面的 index.js 和 log.js 等页面 js 文件移入 /src/pages 文件夹里面。

 

2、打包的入口文件 config/entry.js 改动

// 改动前
walk('./src');


// 改动后
walk('./src/pages')

　

3、config/paths.js 文件改动

// 改动前
mobule.exports = {
    ...
    appIndexJs: resolveApp('src/index.js')
    ...
}

// 改动后
mobule.exports = {
    ...
    appIndexJs: resolveApp('src/pages/index.js')
    ...
}

　　

4、webpack.config.dev.js 和 webpack.config.prod.js（web端打包配置文件改动）

// 改动前
fileList.forEach(function (item) {
  entry[item] = [
    require.resolve('./polyfills'),
    require.resolve('react-dev-utils/webpackHotDevClient'),
    paths.appSrc + '/' + item + '.js',
  ];
  ...
}

// 改动后
fileList.forEach(function (item) {
  entry[item] = [
    require.resolve('./polyfills'),
    require.resolve('react-dev-utils/webpackHotDevClient'),
    paths.appSrc + '/pages/' + item + '.js',
  ];
  ...
}

 

5、webpack.mp.config.js 小程序打包配置文件

// 改动前
module.exports = {
    mode: 'production',
    entry: {
        index: path.resolve(__dirname, '../src/index.js'),
        ...
    }
    ...
}

// 改动后
module.exports = {
    mode: 'production',
    entry: {
        index: path.resolve(__dirname, '../src/pages/index.js'),
        ...
    }
    ...
}