2项目目录设计

Posted 2020-09-30 U201113877

svg图片不会直接使用，而是生成图标字体来使用。生成图标字体的网站https://icomoon.io/icons.html。

图标字体的code如下所示

项目的所有文件都放在src文件夹。main.js文件是整个项目的入口文件，app.vue是整个页面的vue实例文件。src文件下会新建一个common文件，用来包含项目公共的文件和资源，common文件夹下新建三个目录，fonts，js，stylus。stylus是一个CSS预处理器，styl文文件和CSS文件相比，styl文件不需要分号，冒号也可以省略，但为了便于阅读保留分号。components文件下是各个组件的文件（注意组件的就近维护原则）。

用json文件来模拟后台数据，json文件中的数据主要包含三个对象，seller，goods，ratings。

在build->dev-server.js文件中获取json文件中的数据，定义路由apiRoutes

var appData = require("../data.json");
var seller = appData.seller;
var goods = appData.goods;
var ratings = appData.ratings;

var apiRoutes = express.Router();

errno参数表示是否有错误，errno：0表示数据正确。data是返回的数据。

apiRoutes.get(\'/seller\', function (req, res) {
res.json({
errno: 0,
data: seller
});
});

apiRoutes.get(\'/goods\', function (req, res) {
res.json({
errno: 0,
data: goods
});
});

apiRoutes.get(\'/ratings\', function(req, res) {
res.json({
errno: 0,
data: ratings
});
});

用use请求到数据

app.use(\'/api\', apiRoutes);